當jQuery UI選項卡被點擊/激活時觸發一個函數？

我正在使用jQuery選項卡，並通過AJAX調用檢索其中一個選項卡中的內容。但是我不想觸發這個呼叫，直到標籤被點擊（激活），因爲用戶可能不一定點擊它。什麼是最好的方法來做到這一點？當jQuery UI選項卡被點擊/激活時觸發一個函數？

的jQuery UI提供了標籤select和show事件，但是當任何選項卡中選擇或顯示這些火，而不僅僅是特定的一個（據我所知）。

我也試着分配click事件特定標籤的ID：

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

但這個看似沒有效果，該呼叫不會被觸發。

來源

2012-07-12 daGUY

UI的選項卡提供了當您選擇一個選項卡，其功能被觸發。

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

注意使用activate新版本。

reference

來源

2012-07-12 17:47:33

完美地工作！我不知道如何使用'select'作爲特定的選項卡。謝謝！ – daGUY 2012-07-12 18:29:22

@daGUY不客氣:) – 2012-07-12 18:31:24

@RicardoAlvaroLohmann這很好用，但我沒有在文檔中看到select：object，在我找到這個之前就看到了。 – Popo 2014-10-30 19:48:03

您可以嘗試這樣的事：

/*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-12 17:46:34 Engineer

的select事件具有ui參數，你可以檢查所選選項卡的index。這個SO問題有很多例子： jQuery UI Tabs Get Currently Selected Tab Index

然後，您可以在檢查標籤的index時執行ajax調用。

編輯：您還可以在這裏正式jQuery UI的文檔的例子很多：http://docs.jquery.com/UI/Tabs

來源

2012-07-12 17:47:35 Sashenka

的打勾解決方案不起作用了，因爲jquery-ui has changed。您還需要在整個標籤集上調用標籤功能，而不僅僅是一個標籤。並且ui.index需要被替換。如果第二個面板的ID爲「tab2」，則可以使用：

$("#tabs").tabs({ 
    activate: function(event, ui) { 
     if (ui.newPanel.selector == "#tab2") { 
      alert("tab 2 selected"); 
     } 
    } 
});

來源

2014-04-01 05:05:21 user3483642

它爲我工作。 – Viru 2017-09-29 05:50:21

這是它的感謝 – 2017-12-07 20:59:23

當jQuery UI選項卡被點擊/激活時觸發一個函數？

回答

相關問題