20

使用 jQuery UI 选项卡 - 我编写了一个与 ui 选项卡集成的插件。如果.tabs()没有调用它，我已经安装了插件设置来启动 jQuery UI 选项卡，但这只是做一个简单的类检查：

 if(!$globalTabs.hasClass("ui-tabs")){
    $globalTabs.tabs();
 }

但这是有问题的，因为通常为了避免 FOUC，开发人员将 UI 类添加到选项卡中，以便在 document.ready 之前获得更好的初始渲染。

我可以检查不同的类，例如`ui-widget1，但想知道是否有另一种/更好的方法？

4

2 回答 2

43

您可以使用data()查询附加的小部件：

if (!$globalTabs.data("tabs")) {
    $globalTabs.tabs();
}

此行为记录在jQuery UI 的Development & Planning Wiki的Widget factory页面中：

  • 插件实例可通过$( "#something" ).data( "pluginname" )

    • 对包含 DOM 元素的 jQuery 对象的引用可用作实例的属性 as this.element，因此很容易在对象和元素之间来回切换。

更新：从 jQuery UI 1.9 开始，小部件键成为小部件的完全限定名称，点替换为破折号，如下所示：

if (!$globalTabs.data("ui-tabs")) {
    $globalTabs.tabs();
}

1.9 中仍然支持使用非限定名称，但已弃用，并且将在 1.10 中删除支持。

于 2012-09-12T18:27:27.203 回答
3

当我尝试检查实例时，它会以某种方式导致一些错误。

我需要重新初始化选项卡，对我来说，try catch 成功了：

try {
    $('.mytabs').tabs('destroy');
} catch (exception) {}

然后再次初始化：

$('.mytabs').tabs();
于 2014-09-09T12:42:37.900 回答