选项卡小部件实例没有这样的方法“添加”答案

【问题标题】：no such method 'add' for tabs widget instance选项卡小部件实例没有这样的方法“添加”
【发布时间】：2013-05-22 20:44:52
【问题描述】：

我正在使用 jqueryui 选项卡小部件。我正在尝试动态添加选项卡。尝试调用 $('#id').tabs('add',...) 时出现以下错误： "标签小部件实例没有这种方法 'add'"

我正在使用 ASP.NET MVC.4 - Razor - 这是部分视图。容器视图的布局包括正确的 jquery 包包含：

@Scripts.Render("~/bundles/jqueryui")

我正在使用 jquery v2.0.0 和 jquery v1.10.2。

这是初始化期间调用的一些代码：

$('#tSheet').tabs();
$('#tSheet').tabs("add", '', 'Tab test one');
$('#tSheet').tabs("add", '', 'Tab test two');

和html：

<div id="tSheet">
    <ul>
    </ul>
</div>

对我为什么会收到此错误有任何想法吗？谢谢，吉姆

在得知 jquery-u1 1.10.2 删除了 add 方法后，我将该代码替换为以下代码：谢谢凯文，

添加将 add 替换为以下调用刷新会导致不同的错误。

$('#tSheet > ul').append('<li><a href="#general">General</a></li>');
$('#tSheet').append('<div id="#general">Some text</div>');

$('#tSheet').tabs('refresh');

当我单击选项卡时，这会导致异常。

【问题讨论】：

最新版本的 jQuery UI 选项卡没有添加方法。而是自己添加新选项卡和选项卡内容并调用刷新方法。
第二行应该是：$('#tSheet').append('<div id="general">Some text</div>'); 你忘了去掉# 符号

标签： jquery jquery-ui asp.net-mvc-4 jquery-ui-tabs razor-2

【解决方案1】：

jquery ui 现在没有add 方法。你可以阅读文档here。

但是您可以通过将 html 添加到内容中来解决您的问题，例如使用 jquery .append() 函数。然后创建标签：

$('#tSheet').tabs();

Here你可以看看例如html应该怎么看。

Nice jsFiddle example of adding new elements.

【讨论】：

那里的示例不演示添加新标签，只是内容。
@Jim 让我们看看我添加到答案中的示例。
谢谢。我现在无法选择选项卡。我尝试$('#tSheet').tabs('select', '#tabs-1'); 这适用于 jsFiddle 上最新版本的 jquery-ui 支持 - 但不适用于 1.10.2 版。

【解决方案2】：

Select 现在被选项活动覆盖，即第一个选项卡的$('#tSheet').tabs('option','active', 0)。使用选项卡数组中的选项卡编号（键）代替0 来选择（激活）其他人。

【讨论】：

【解决方案3】：

我想我会在这里发表评论，以防其他人遇到这个问题。

您的解决方案有效。我认为您的代码中有错字。 div 的 id 前不应有 #。

$('#tSheet > ul').append('<li><a href="#general">General</a></li>');
$('#tSheet').append('<div id="general">Some text</div>');
$('#tSheet').tabs('refresh');

理想情况下，如果标签已经存在，我们不希望添加标签。

var elements_ = [];
$('#tSheet > div').each(function(){
    elements_.push(this.id); 
});
if ($.inArray(title, elements_) === -1){ //add the tab here..
}

【讨论】：