jQuery UI Tabs選擇功能不起作用

Question

我有以下jquery用於在我的網站上創建標簽（包裝在文檔就緒功能中）：

$('#understanding-water-management').tabs({
    select: function(event, ui) {
        alert('hi');
    }
});

但是，在我的網站上，選項卡更改未啟用選擇功能。 我創建了一個小提琴，但是它能按我期望的那樣工作（它在標簽更改時發出警報）。

這兩個站點之間的唯一區別是，在我自己的網站上，我使用的是jQuery UI的較輕版本，其中我僅下載了Core，Widget（來自UI Core）和Tabs（來自Widget）選項。 我還需要下載其他選項才能使上面的select功能正常工作-我不想使用完整的jQuery UI，因為我只需要使用選項卡即可，因此希望使我的js文件盡可能少

Answer 1

嘗試將代碼包裝在DOM ready處理程序$(function() {...}); 確保在執行jQuery代碼之前正確加載所有DOM元素：

$(function() {
    $('#understanding-water-management').tabs({
        select: function(event, ui) {
            alert('hi');
        }
    });
});

您的jsFiddle有效，是因為當您包含jQuery時，默認情況下它們已經為您完成了上述工作。

Answer 2

jQuery UI 1.10將select更改為beforeActivate （如果您希望在選擇選項卡之前觸發該功能）或activate （如果您希望在選擇選項卡之后觸發該功能）

嘗試

$('#understanding-water-management').tabs({
    beforeActivate: function(event, ui) {
        alert('hi');
    }
});