jQuery的手风琴/标签 - 当的内容

负载调用不同的函数I有以下标记：jQuery的手风琴/标签 - 当的内容

<body> 
    <div id="tabs" style="float: left"> 
     <ul> 
      <li><a href="ajax/question_0.html" title="Question 1"><span>Question 1</span></a></li> 
      <li><a href="ajax/question_1.html" title="Question 2"><span>Question 2</span></a></li> 
      <li><a href="ajax/question_2.html" title="Question 3"><span>Question 3</span></a></li> 
      <li><a href="ajax/question_3.html" title="Question 4"><span>Question 4</span></a></li> 
      <li><a href="ajax/question_4.html" title="Question 5"><span>Question 5</span></a></li> 
      <li><a href="ajax/question_5.html" title="Question 6"><span>Question 6</span></a></li> 
     </ul> 
     <div id="dynamicContent"> 
     </div> 
    </div> 
    <div class="demo-description"> 
     <p>Click tabs to see answers to Questions</p> 
    </div> 
</body>

我想利用手风琴或从UI选项卡插件。在加载事件完成后，我想调用JavaScript函数，但每个选项卡都有不同的功能 - 就像调用onDocumentReady页面一样。

我有以下的JavaScript：

$(function() { 
    $('#tabs').tabs().bind('tabsselect', function(event, ui) { 
     console.log("Loading: ajax/question_" + ui.index + ".html"); 
     return true; //Ensure that the tab gets selected 
    }); 
);

这是正确加载阿贾克斯文件和所有，但每当我试图做一些事情，如评估在JS一份声明中，它似乎被忽略。有什么办法可以做到这一点，所以一旦文件加载，我的函数被调用 - 需要为每个选项卡的不同功能。下面

编辑：

切换事实上确实减轻我调用不同的功能的问题。我没在想...

但是，我所追求的是在这些用于日志记录的每个选项卡中都有一个空的div（万一我在没有Firebug的Web环境中）。

我有以下功能：

if (typeof console === 'undefined') { 
    var console = { }; 
    console.log = function(msg) { 
     $('#dynamicContent').append(createElement('p', msg)); 
    }; 
}

这是应该将消息记录到它在每个片的加载一个div，但在加载新的选项卡没有记录的完成。

我的选项卡设置下列要求：

$('#tabs').tabs({ 

    select: function(event, ui) { 
     log.debug("Loading: ajax/question_" + ui.index + ".html"); 
    }, 

    show: function(event, ui) { 
     log.debug("Finished Loading: ajax/question_" + ui.index + ".html"); 
    } 
});

来源

2010-05-26 Scott

我不正是你以后，但有一个tabsload event就可以使用，这样的：

$(function() { 
    $('#tabs').tabs().bind('tabsselect', function(event, ui) { 
    console.log("Loading: ajax/question_" + ui.index + ".html"); 
    return true; //Ensure that the tab gets selected 
    }).bind('tabsload', function(event, ui) { 
    switch(ui.index) { 
     case 0: 
     //do something for first tab... 
     break; 
     case 1: 
     //do something for second tab... 
     break; 
     //etc... 
    } 
    }); 
);

我使用switch statement来表示“需要为每个选项卡设置不同的功能”，但无论您需要做什么，调用外部函数等，您都可以在此处执行此操作。例如，如果您需要在href上进行切换，则可以使用ui.tab作为锚点元素，无论哪种方式最合适。

来源

2010-05-26 21:47:52

jQuery的手风琴/标签 - 当的内容

回答

相关问题