循環通過dyamically生成的jQuery選項卡並添加類

Question

好的，所以我有一個選項卡式界面，動態添加選項卡，一旦鏈接被點擊並使用ajax填充新生成的選項卡。該部分工作正常，但我需要擴展功能，以允許動態創建的選項卡還可以在同一次單擊時爲其分配類。我目前的代碼如下：

$(document).ready(function() { 
    var tabs = $("#tabs").tabs(); 
    $(".tabButton").live("click", function(){ 
     var getTopicID = $('.topicID',$(this).parent()).val(); 
     tabs.tabs('add', 'ajax.php?section=summary&id=' + getTopicID, 'Summary'); 
     tabs.tabs('add', 'ajax.php?section=read&id=' + getTopicID, 'Read Topic'); 
    }); 
}); 

此代碼工作絕對沒問題添加選項卡。但是，我不確定如何去添加課程。我試過直接放置在第二tabs.tabs行後以下，但無濟於事：

$(this).addClass('testClass'); 

的主要問題是生成的標籤被賦予＃UI-tabs- *，其中*是一個的ID以偶數形式自動遞增值。我應該指出，分配一個班級的原因是，他們可以在以後被銷燬。我也考慮過使用每個函數，但我不確定這是否是最好的方法。

道歉，如果這看起來有點愚蠢的問題，jQuery不完全是我的強項。

編輯

好了，從下面大黃蜂的建議下，我已經加了一點更多的功能，即具有相同onclick事件清除以前創建的任何標籤：

$(document).ready(function() { 
    var tabs = $("#tabs").tabs(); 
    $(".tabButton").live("click", function(){ 
     $(\'div[id*="ui-tabs-"]\').each(function(index) { 
      if($(this).hasClass(\'testClass\')) 
      $("#tabs").tabs("remove", \'.testClass\'); 
     }); 
     var getTopicID = $(\'.topicID\',$(this).parent()).val(); 
     tabs.tabs(\'add\', \'ajax.php?section=summary&id=\' + getTopicID, \'Summary\'); 
     tabs.tabs(\'add\', \'ajax.php?section=read&id=\' + getTopicID, \'Read Topic\'); 
     $(\'div[id*="ui-tabs-"]\').each(function(index) { 
      if(!$(this).hasClass(\'testClass\')) 
      $(this).addClass(\'testClass\'); 
     }); 
    }); 
}); 

現在這個代碼在一定程度上起作用。用戶界面有一個持久性的標籤（主標籤包含onclick鏈接），然後是由該鏈接生成的兩個標籤。但是，上面的代碼刪除了永久性選項卡，並使兩個生成的選項保持不變！有任何想法嗎？

進一步編輯

好了，看文件後，你必須提供刪除功能與標籤索引中刪除基於一類的名字，你不能刪除標籤。所以不知何故，remove函數必須首先獲取選項卡的索引（如果它具有testClass類），然後將其刪除。我正在讀這個嗎？

Answer 1

我完全忘了關閉這個。我最終得到它具有下列工作：

var tabs = $("#tabs").tabs({ spinner: 'Retrieving data...' }); 
$(".tabButton").live("click", function(){ 
    var getTopicID = $('.topicID',$(this).parent()).val(); 
      $("#tabs").tabs("remove",1); 
      $("#tabs").tabs("remove",1); 
    tabs.tabs('add', 'ajax.php?section=summary&id=' + getTopicID, 'Summary'); 
    tabs.tabs('add', 'ajax.php?section=read&id=' + getTopicID, 'Read Topic'); 
}); 

的tabsremove函數刪除與索引1的標籤，並且一旦所述第一接線片被除去第二個標籤則呈現1的索引，由此去除兩者。

Answer 2

您可以使用通配符通過選擇所有生成的標籤，然後循環，檢查他們是否有類或不：

$(document).ready(function() { 
    var tabs = $("#tabs").tabs(); 
    $(".tabButton").live("click", function(){ 
     var getTopicID = $('.topicID',$(this).parent()).val(); 
     tabs.tabs('add', 'ajax.php?section=summary&id=' + getTopicID, 'Summary'); 
     tabs.tabs('add', 'ajax.php?section=read&id=' + getTopicID, 'Read Topic'); 
     $('div[id*="ui-tabs-"]').each(function(index) { 
      if($(this).hasClass('testClass')) 
       $(this).remove(); 
      else 
       $(this).addClass('testClass'); 
     }); 
    }); 
});