刪除動態創建的jQuery UI選項卡

我有一個jspx頁面上的7個jQuery UI選項卡。我動態地添加一個新標籤，以從搜索表單呈現搜索結果。到現在爲止還挺好。現在當用戶點擊任何其他選項卡時，必須刪除新創建的「搜索結果」選項卡。這是我的問題開始的地方。刪除動態創建的jQuery UI選項卡

   $('#tabs').tabs({ 
        select : function(event, ui) { //bind click event to link     
         selectedIndex = ui.index; 

         if ((selectedIndex < 8) && ($('#tabs').tabs("length") > 8)) { 
          $('#tabs').tabs('remove',8); 
         } 

         //I have other stuff here for each of the original 7 tabs 
       });

看來，這個選項卡只可刪除後，我重新初始化標籤像

$('#tabs').tabs('destroy').tabs(); 
$('#tabs').tabs('remove',8);

但是我有一個動態添加到標籤的基礎上，系統我的頁面上的數據網格標籤索引被點擊。如果我銷燬，然後刪除，我的網格消失完全形成所有其他標籤（從dom刪除），這是我想要的而不是。

請幫忙，謝謝。

來源

2011-11-01 Binaryrespawn

問題是，您試圖刪除當前顯示的選項卡。由於這個事件在真正發生標籤變化之前觸發，所以你基本上是從地下拉出地毯。來自UI源：

select: function(index) { 
    index = this._getIndex(index); 
    if (index == -1) { 
     if (this.options.collapsible && this.options.selected != -1) { 
      index = this.options.selected; 
     } else { 
      return this; 
     } 
    } 
    this.anchors.eq(index).trigger(this.options.event + ".tabs");//YOUR EVENT 
    return this; 
},

如果你想刪除一個標籤，你必須小心「何時」發生這種情況。當你連接到「show」時，你的代碼工作正常。

show: function(event, ui) { //bind click event to link     
       selectedIndex = ui.index; 

       if ((selectedIndex < 2) && ($('#tabs').tabs("length") > 2)) { 
        $('#tabs').tabs('remove',2); 
       } 
      }

jsfiddle

來源

2011-11-01 19:32:50 Sinetheta

謝謝Sinetheta，我用show選項，它工作得很好。 – Binaryrespawn

-1

你爲什麼要摧毀它們？刪除應該工作得很好。 jsFiddle

$("#tabs").tabs(); 
$("#remove").click(function(){ 
    $("#tabs").tabs("remove",0); 
})

來源

2011-11-01 17:18:26 Sinetheta

的「$（」#tabs「）.tabs（」去除「0）;」工作不正常，它對7個原始選項卡中的任何一個都可以正常工作，但動態插入的選項卡會導致firefox「掛起」。 – Binaryrespawn

刪除動態創建的jQuery UI選項卡

回答

相關問題