5

我正在使用 jQuery 选项卡，其中一个选项卡中的内容是通过 AJAX 调用检索的。但是我不想在单击选项卡（激活）之前触发呼叫，因为用户可能不一定会单击它。最好的方法是什么？

jQuery UI提供select和show选项卡的事件，但选择或显示任何选项卡时这些火灾，而不仅仅是一个特定的选项卡（据我所知）。

我还尝试将click事件分配给特定选项卡的 ID：

$("#my-tab").click(function(){
...
     $.post(URL, function(data){
          ...
     });
...
}

但这似乎没有任何效果，并且永远不会触发呼叫。

4

4 回答 4

17

勾选的解决方案不再起作用，因为jquery-ui 已更改。您还需要在整个选项卡集上调用选项卡功能，而不仅仅是一个选项卡。ui.index 需要更换。如果第二个面板的 id 为“tab2”，那么您可以使用：

$("#tabs").tabs({
    activate: function(event, ui) {
       if (ui.newPanel.selector == "#tab2") {
            alert("tab 2 selected");
       }
    }
});
于 2014-04-01T05:05:21.137 回答
8

Ui-tabs 提供了一个功能，当您选择一个选项卡时会触发该功能。

$( ".yourTab" ).tabs({
   select: function(event, ui) {
        if(ui.index == myTabIndex) {
            $.post(URL, function(data){
              ...
            });
        }
   }
});

注意用于activate新版本。

参考

于 2012-07-12T17:47:33.237 回答
1

你可以尝试这样的事情：

/*tab placeholder*/.tabs({
    select: function(event, ui) {
       if(ui.item.id === "my-tab"){
           //explicitly trigger mouse click on tab
           $(ui.item).trigger('click');
       }
    }
});
//------------------
$("#my-tab").click(function(){
    alert('something')
});
于 2012-07-12T17:46:34.003 回答
1

该select事件有一个ui参数，您可以在其中检查index所选选项卡的 。这个 SO 问题有很多例子： jQuery UI Tabs Get Current Selected Tab Index

然后，您可以在检查index选项卡后进行 ajax 调用。

编辑：您在此处的官方 Jquery UI 文档中也有许多示例：http: //docs.jquery.com/UI/Tabs

于 2012-07-12T17:47:35.560 回答