0

次のようなjQueryタブを使用しています。http： //jqueryui.com/tabs/ 上部にタブの行を表示でき、HTMLがこれらのセクションに分割され、これらのタブをアクティブ化すると表示されます。

しかし、私はこの感覚に完全に満足しているわけではありません。

システムの周りにはさまざまHrefな場所にリダイレクトするさまざまなものがあるので、URLから関連するタブを開きながら、これらのタブを表示するページへのリンクにリダイレクトできる方法があるかどうか誰かが知っているかどうか知りたいですまたは別のアプローチ？

たとえば、IDを指定し、そのIDdivにできるhrefと、ページがそのポイントまでスクロールダウンする簡単な方法です。これにより、URLで移動したいページのタブを指定できます。一度jQueryと組み合わせると、これは不可能です。

4

1 に答える 1

1

タブの作成すべての呼び出しはdocument.ready（）関数内で行われます。まず、通常のjQueryUI手法を使用してタブを作成します。この場合、タブulと関連するdivを「tab-set」のクラスを持つdivにラップしました。

$(".tab-set").tabs();

新しい訪問者を正しいタブに誘導する次に、特定のタブをロードする必要があるかどうかを確認します。現在のページに「タブセット」divがあるかどうかを確認し、URLの最後にハッシュがあるかどうかを確認します。両方に「はい」の場合は、scrollToプラグインを使用して「タブセット」divにジャンプします。これにより、タブが表示されたままになり、jQueryUIのデフォルトの動作に基づいて正しいタブコンテンツが表示されます。

if($(".tab-set") && document.location.hash){
  $.scrollTo(".tab-set");
}

タブのブックマーク可能なURLの作成ユーザーがページにアクセスすると、localScrollプラグインを使用して、ページが再読み込みされないようにしながら、アドレスバーのURLを更新します。

$(".tab-set ul").localScroll({ 
  target:".tab-set",
  duration:0,
  hash:true
});

つまり、「リンク自体のターゲットではなく、divの「タブセット」までスクロールし、アニメーションなしで実行して、URLにハッシュを追加する」ということです。それでおしまい！すべての要件が満たされました。

jQueryのリンクから特定のタブを開く方法から来ました

于 2012-10-11T14:57:47.967 に答える