删除动态创建的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选项卡

回答

相关问题