web-dev-qa-db-ja.com

jQuery UIタブが初期化されているかどうかを確認します（クラスを確認せずに）

JQueryUIタブの使用-そして私はuiタブと統合するプラグインを作成しました。 .tabs()が呼び出されていない場合に、jQuery UIタブを開始するプラグインのセットアップがありますが、これは単純なクラスチェックを実行するだけです。

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

ただし、これには問題があります。FOUCを回避するために、開発者はUIクラスをタブに追加して、document.readyの前により良い初期レンダリングを取得するためです。

ʻui-widget1などの別のクラスを確認することはできますが、別の/より良い方法があるかどうか疑問に思っていますか？

jqueryjquery-uijquery-ui-tabs
20
Jason

添付されたウィジェットは data（） ：でクエリできます。

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

この動作は、jQuery UIの ウィジェットファクトリ ページ Development＆Planning Wiki に記載されています。

  • $( "#something" ).data( "pluginname" )を介してアクセス可能なプラグインインスタンス

    • DOM要素を含むjQueryオブジェクトへの参照は、インスタンスのプロパティとして_this.element_として使用できるため、オブジェクトと要素の間を簡単に行き来できます。

更新：jQuery UI 1.9以降、 ウィジェットキーはウィジェットの完全修飾名になり、ドットはダッシュに置き換えられます 、に：

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

修飾されていない名前の使用は1.9でも引き続きサポートされていますが、非推奨であり、1.10ではサポートが終了します。

43
Frédéric Hamidi

インスタンスをチェックしようとすると、どういうわけかエラーが発生します。

私はタブを再初期化する必要があり、私にとってはトライキャッチがトリックをしました：

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

その後、再度初期化します。

$('.mytabs').tabs();
3
Guntram