jquery-ui選項卡中的.select，.show和.load之間有什麼區別？

我發現當選中一個選項卡時會觸發三個事件，並且我看到事件被觸發的順序，但我很困惑要使用哪個事件或這些事件如何真正不同。如果所有三個都被解僱了，我不能只是把我的代碼放在任何事件中嗎？jquery-ui選項卡中的.select，.show和.load之間有什麼區別？

我必須在這裏失去一些東西。有人可以澄清嗎？

因此，在弄亂了這個之後，我將分享我最終做的事，希望它能幫助別人。

我不得不根據Ajax調用中返回的數據生成動態選項卡。它基本上是日期的數據，其中標籤是日期，並顯示該日期內的任何數據。

從返回的數據生成選項卡很容易，但我無法弄清楚如何寫出關聯的數據。最後（我應該從這裏開始），我查看了生成的dom，並注意到動態創建的選項卡也創建了一個div。也許這對一些人來說是顯而易見的（這對我來說不是這樣），如果是在文檔中，我錯過了它。無論如何，這段代碼會從一個數組中生成標籤，然後在點擊標籤時將html附加到關聯的div。我不需要所有的變量，但我認爲這可能會使它更具可讀性。 在添加標籤之前添加顯示功能，否則它將無法工作！

var _sessionDates = getSessionDates(sessionData.Sessions); 
var $tabs = $("#sub-tabs"); 
$tabs.tabs({ 
    show: function(event, ui) { 
     var selected = $tabs.tabs('option', 'selected'); 
     var _sessionDates = getSessionDates(sessionData.Sessions); 
     var grid = buildGrid(_sessionDates[selected]); 
     $('#' + _sessionDates[selected]).html(grid); 
    } 
}); 

$(_sessionDates).each(function(i, dayOfShow) { 
    var d = dateFormat(dayOfShow, "mediumDate"); 
    $tabs.tabs('add', '#' + dayOfShow, d); 
});

最後，我不得不「滾動」通過在選項卡中顯示我的數據，我能做到這一點與這兩條線。第一行給出了與選定的選項卡相對應的div元素的id（這實際上是重要的部分），第二行只是調用我的方法，並傳遞給div的id少於'＃'。我的約會也是我的身份證。有一個全局變量，我在這之外改變了它，使它工作。我知道這很糟糕，當我重構它時我會刪除它。

var $el = $($('#sub-tabs a')[$('#sub-tabs').tabs('option', 'selected')]).attr('href'); 
$($el).html(buildGrid($el.replace('#', '')));

來源

2011-05-20 Jay

select被點擊選項卡時被觸發，但之前的標籤已被證明

load遠程標籤的內容已經被加載之後被觸發（即，選項卡其內容不是初始頁面有效載荷的一部分，但當用戶點擊相關選項卡時，通過ajax調用加載）

show被觸發後一個選項卡已被證明

的jQuery documentation使得這個比較清晰，但我不得不爲了充分了解select和show之間的差異進行試驗。

來源

2011-05-20 13:36:51

是的，我創建了一些事件並投擲了一些警報，並觀察它們是如何被解僱的。我得到了創建和選擇，創建被激發一次，選擇幾乎被作爲退出事件觸發。加載和顯示正在投擲我，但現在它完成ajax調用後啓動加載是有意義的。 – Jay 2011-05-20 21:23:15

jquery-ui選項卡中的.select，.show和.load之間有什麼區別？

回答

相關問題