5

私は jQuery タブを使用しており、タブの 1 つのコンテンツは AJAX 呼び出しを介して取得されます。しかし、ユーザーが必ずしもタブをクリックするとは限らないため、タブがクリックされる (アクティブになる) まで呼び出しをトリガーしたくありません。これを行う最善の方法は何ですか？

jQuery UI はタブにselectおよびshowイベントを提供しますが、これらは (私の知る限り) 特定のタブだけでなく、任意のタブが選択または表示されたときに発生します。

clickまた、特定のタブの ID にイベントを割り当ててみました。

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

しかし、これは効果がないように見え、呼び出しはトリガーされません。

4

4 に答える 4

17

jquery-ui が変更されたため、チェックされたソリューションは機能しなくなりました。また、1 つのタブだけでなく、タブセット全体でタブ関数を呼び出す必要があります。また、ui.index を置き換える必要があります。2 番目のパネルの 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-tab は、タブを選択したときにトリガーされる機能を提供します。

$( ".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 currently selected Tab Index

タブの をチェックしたら、ajax 呼び出しを実行できindexます。

編集: ここの公式の Jquery UI ドキュメントにも多くの例があります: http://docs.jquery.com/UI/Tabs

于 2012-07-12T17:47:35.560 に答える