移除JQuery UI选项卡

Question

我尝试使用一些（简单的）代码来删除我动态创建的 JQuery UI 标签页，但不幸的是，它没有协作。

以下是我正在使用的 JavaScript 方法：

    function removeTab(tabName) {

        var tabIndex = -1;
        $('#tabbedPanel > ul > li > a').each(
                function(i) {
                    if (this.href == tabName) {
                        tabIndex = i;
                    }
                });

        $('#tabbedPanel').tabs("remove", tabIndex);

    }

很不幸，我得到的只是“对象不支持此属性或方法”。我确信选项卡索引是正确的。有人能提供帮助吗？

- Jason

---

你能展示一下完整的代码吗？你从哪里获取tabs变量/方法？ - corroded

如果在 .each() 之后警告 tabIndex，它仍然是 -1 吗？ - Nick Craver

Answer 1

很高兴你已经解决了问题。

一个建议 - 你可以使用选项卡API来找出选定的选项卡索引并更轻松地删除它，而不是循环遍历选项卡。

这里是我制作的fiddle（使用jQueryUI演示选项卡和一些增强功能）。

关键部分是使用“selected”选项。我有一个按钮，当点击时，会提示所选选项卡的索引...

$("#get_index").click(function(e) {
    e.preventDefault();
    alert("Selected tab index = " + $("#tabs").tabs("option", "selected"));
});

我有一个不同的按钮，当点击时，将获取所选索引，然后使用“remove”选项来删除该选项卡。这样，您就不必匹配href名称...

$("#remove_selected").click(function(e) {
    e.preventDefault();
    var selIndex = $("#tabs").tabs("option", "selected");
    $("#tabs").tabs("remove", selIndex);
});

虽然你已经解决了你的问题，但我还是想分享一下这个。希望它能有所帮助！

- David Hoerster

Answer 2

这是一个DOM问题。被加载的jsp片段中包含头部和正文标签。我没有立即注意到它，因为它上面的addTab()方法运行良好。

- Jason