JQuery UI按鈕，在jQuery UI選項卡之間來回切換不起作用

Question

初學者。我有一些標籤，併爲每個標籤內容動態加載文本文件kinda的東西。因此每個選項卡都是單擊的，包含內容的文本文件將加載該選項卡。

$('#thisMainTabs').tabs({selected:0}); 

<div id='thisMainTabs'> 
<ul> 
<li><a href='/scripts/thisMainTabs1.txt'>Tab 1 Content</a></li> 
<li><a href='/scripts/thisMainTabs2.txt'>Tab 2 Content</a></li> 
<li><a href='/scripts/thisMainTabs3.txt'>Tab 3 Content</a></li> 
<li><a href='/scripts/thisMainTabs4.txt'>Tab 4 Content</a></li> 
<li><a href='/scripts/thisMainTabs5.txt'>Tab 5 Content</a></li> 
</ul> 
</div> 

就像我想的那樣基本。在一些這些選項卡我有也非常基本的

文檔中準備的jQuery按鈕：

$('#btnNumber1').button({icons: {primary: 'ui-icon-circle-plus' secondardy: null} }); 

$('#btnNumber1').click(function() { 
    alert('working'); 
}); 


<div id='btnNumber1'>add new<div> 

所以我只是用這些警報，但實際上這些東西打開的對話框（是jQuery的對話爲例太）。似乎正在發生的事情是每個選項卡在第一次選中時都會呈現該按鈕，並且它可以正常工作，但是如果我返回到選項卡，該按鈕就在那裏，但單擊時不會執行任何操作。不知道它的對話框或按鈕？但一切都是第一次通過。

我很新，所以非常感謝任何幫助。謝謝！

編輯：應該澄清一些事情多一點。道歉。

所以上面的.tabs（）和#thisMainTabs是主頁面內容中唯一的東西。除了默認的標籤內容......沒有什麼，但真正的文字。在其他每個選項卡中（還有大約5個）我有href指向文本文件的鏈接。這些文本文件中的每一個都包含這些標籤內容（標記，js，css等），並且在每一個文本文件中我都有一個$（document）.ready ....這是一個奇怪的想法，但與其他一切似乎上班？？我會再次聲稱初學者:)。所以我有手風琴，我有按鈕，我有對話框（所有jQ），並且一切正常，直到我注意到上述行爲。如果我第一次選擇每個選項卡，內容加載，按鈕就在那裏，我點擊它，並且它可以工作（大多數是對話框）。在標籤之間切換，並且只要第一次點擊標籤時，它們都可以工作。

但是，如果我回到選項卡，按鈕在那裏，但什麼都不做。

我上面的一個例子是我如何使用所有按鈕來推斷他們的按鈕和設置點擊功能。這些文件中的每一個都位於文檔中，用於每個選項卡的每個文本文件。我有雙重和三重檢查所有ID以確保一切都是獨一無二的;爲了確保這種情況不會發生，因爲它集合了很多腳本。對我anywany ....

更新：不知道如果它的按鈕或對話框我有麻煩，上述問題似乎是孤立的那些按鈕，引發對話。儘管如此，第一次很好，第二次不太好。附加警報給一些並且工作正常。

對話框是這樣構建的（也完全在文本文件中，並且在該文本文件的文檔準備好之後）。

$('#thisDialogDiv').dialog({ 
         resizable:false, 
         width:200, 
         modal: true, 
         autoOpen: false, 
         buttons: { 
         "Ok": function() { $(this).dialog("close"); } } 
         }); //not bothering with buttons 

<div id="thisDialogDiv"> 
<h3>Here is the Title</h3> 
<p>Here is some content on the dialog</p> 
</div> 

對上面提到的呼叫對話框這樣

$('#btnNumber1').click(function() { 
    $('#thisDialogDiv').dialog("open"); 
}); 

而且基本上是它爲每個實例....非常基本的我猜的按鈕。

Answer 1

我想我現在明白你的問題了。

你有一個div與每個標籤中的id="btnNumber1"。但是這些標籤都存在於同一個窗口中（或者更正確的說，框架），並且html id在給定的文檔中必須是唯一的。

所以，你需要給按鈕ID = btnNumber2在你的第二個選項卡，btnNumber3在你的第三個，等它只能你的第一個選項卡上的原因是所有的代碼被發現在DOM存在的第一個。

編輯：

賈斯汀，如果你的父文檔中做委派的綁定？例如：

$('#thisMainTabs').on('click', '#btnNumber1', function() { alert('Button 1 clicked'); }); 

這是100％的時間呢？我不是在暗示這是解決方案......我認爲這是很好的，你保留了與內容相關的代碼......否則它就成爲維護噩夢，但我覺得有點事情要做加載....也許.ready()不會在第一次加載標籤後觸發？不知道，做WAGs;）