Question

在这个问题上寻找时间，我必须做些蠢事。 jQuery UI v1.11.1。有一个标签小部件，我的第一个标签是在我的.html中静态创建的。在第一个选项卡上，有一个用于创建新选项卡的按钮：

function addTab(tabTitle) {

    var tabs = $("#tabs").tabs();
    var ul = tabs.find("ul");
    var id = "tabs-" + tabCounter;
    $("<li><a id='" + id + "' href='server.html'>" + tabTitle.val().toUpperCase() + "</a></li>").appendTo(ul);
    tabs.tabs("refresh");

    var index = $("#tabs a[id='" + id + "']").parent().index();
    $("#tabs").tabs({ active: index}); // This successfully selects the new tab visually on the screen

    //$("#" + id).click(); // Tried selecting the tab this way also, same issue

    var curTabPanel = $('#tabs .ui-tabs-panel:not(.ui-tabs-hide)');
    alert(curTabPanel.prop("id")); // This returns the ID of the first tab, not the tab selected on screen, not sure what that implies

    $("input").css("display", "none"); // This makes all the input fields disappear on the first tab, not on the tab selected on screen

    tabCounter++;
}

正如您所看到的，我尝试了多种方式切换到新选项卡作为活动选项卡，但两种方式似乎只允许我操作第一个（现在隐藏）选项卡上的元素 - 即使在视觉上是新的选项卡在屏幕上被选中。

最终，我需要在文档上定义的所有jQuery处理程序都可以应用于这个新选项卡中的新元素。

我做错了什么？

- 编辑 -

如果我手动在新标签上创建元素（而不是从server.html加载它们），我可以使用jQuery来控制元素。

是否有理由通过外部html文件加载标签内容会使这些元素无法被jQuery访问？

由于

Answer 1

我认为你错过了添加标签的div元素..

  tabs.append( "<div id='" + id + "'><p>" + tabContentHtml + "</p></div>" );

jQuery UI选项卡，无法访问新选项卡中的对象？

1 个答案: