Jquery ui选项卡隐藏的div出现在主选项卡上

我不知道该如何描述/问这个问题，所以我会尽我最大的努力。我正在jquery的选项卡中使用添加选项卡功能。在第一个选项卡上，我有一个jqgrid，用于选择要在新选项卡中打开的项目。当一个项目被选中时，新选项卡被成功创建，但是一个div被添加到jqgrid下面，它看起来像下面（添加了空白）。我可能做错了什么导致这个幻影师出现？我是用firebug发现的，但是因为我还没有切换标签，所以应该没有显示任何内容，对吗？另外，似乎为我所做的每个addtab创建了2个div。2正常吗？
编辑：2不正常，示例代码不会在jQueryUI网站上创建两个

<div id="ui-tabs-2" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-tabs-hide"></div>

和选项卡模板

tabTemplate: "<li><a href='#{href}'>#{label}</a><span class='ui-icon ui-icon-close'>Remove Tab</span></li>",

tabTemplate:“
删除选项卡”
”，

编辑：添加一个选项卡基本上就是创建两个div。实际上需要奇数ID，而偶数ID则不需要。（id a div with id=“ui-tabs-3”是正确的，但添加了另一个选项卡，id=“ui-tabs-2”。不需要2）。我没有告诉它添加两个选项卡，偶数的东西是愚蠢的，没有任何东西，但我相信它会导致疯狂的空白出现和增长，每次我添加一个新的选项卡。有什么想法吗？我不会做任何复杂的事情，也不能进一步分解代码，我不认为不去掉add功能本身

谢谢

编辑：还有标签初始化的东西？我错过了什么明显的东西吗？似乎涉及到6行代码，有人会认为我会看到我搞砸了什么

var $tabs = jQuery("#tabs").tabs({
                    //tabTemplate: "<li><a href='http://localhost:8000/tickets/byId/#{href}/'>#{label}</a> <span class='ui-icon ui-icon-close'>Remove Tab</span></li>",
                tabTemplate: "<li><a href='#{href}'>#{label}</a><span class='ui-icon ui-icon-close'>Remove Tab</span></li>",
                ajaxOptions: {
                    error: function(xhr, status, index, anchor) {
                        jQuery(anchor.hash).html("If you're reading this then something didn't go right....oops.");
                    }
                }
            }).bind("tabsselect",function(event,ui){
                if (ui.index == 0) {
                    $grid.trigger('reloadGrid');
                }
            });

var$tabs=jQuery（#tabs”）.tabs({
//选项卡模板：“
删除选项卡”
”，
选项卡模板：“
删除选项卡”
”，
ajaxOptions：{
错误：函数（xhr、状态、索引、锚定）{
jQuery（anchor.hash）.html（“如果你正在读这篇文章，那么有点不对劲……哎呀。”）；
}
}
}).bind（“选项卡选择”，函数（事件，用户界面）{
如果（ui.index==0）{
$grid.trigger（'reloadGrid'）；
}
});

我相信这个错误回答了我的问题

---

您是否进行过调试，以查看addTab是否可能被多次调用，从而导致额外的选项卡？@Andrew Whitaker:我不认为是这样。但我不知道如何使用firebug解决这个问题。然而，如果它被调用了两次，那么我想我的标签会显示不止一次。正在创建的额外div与任何内容都不一致。另外，如果它被调用两次，我希望有两个选项卡是相同的，因为jqgrid中仍然选择了该行，这意味着第二次调用仍然应该基于addTab函数的第一行打开相同的选项卡。这听起来合乎逻辑吗？是的，这很有意义——您可以在Firebug中的该函数中放置一个断点，然后查看它何时被命中。（以下是方法：）

var $tabs = jQuery("#tabs").tabs({
                    //tabTemplate: "<li><a href='http://localhost:8000/tickets/byId/#{href}/'>#{label}</a> <span class='ui-icon ui-icon-close'>Remove Tab</span></li>",
                tabTemplate: "<li><a href='#{href}'>#{label}</a><span class='ui-icon ui-icon-close'>Remove Tab</span></li>",
                ajaxOptions: {
                    error: function(xhr, status, index, anchor) {
                        jQuery(anchor.hash).html("If you're reading this then something didn't go right....oops.");
                    }
                }
            }).bind("tabsselect",function(event,ui){
                if (ui.index == 0) {
                    $grid.trigger('reloadGrid');
                }
            });