クエリ文字列値を渡して、次のページで関連する jquery タブを開きます

Question

ページ 1 にクエリ文字列のリンクがあります href="page2.html?selected=1".

私が望むのは、ページ 1 でこのリンクをクリックすると、ページ 2.html に移動し、このクエリ文字列値を使用して特定の jquery タブ（jquery タブを使用）を開く必要があるということです。

機能は次のとおりです。

$(function selectTab(indexId){
    var activeTab = location.href;
    var activeTabId = activeTab.substring(activeTab.lastIndexOf('=') + 1);
    $('#tabs').tabs('select', indexId);
})

この問題を解決するにはどうすればよいか教えてください??

Answer 1

この方法でも実行できますが、変数が混在しているため、次のようになります。

$(function selectTab(){
    var activeTab = location.href;
    var activeTabId = activeTab.substring(activeTab.lastIndexOf('=') + 1);
    $('#tabs').tabs('select', activeTabId);
})

しかし, 、これにはすでに組み込みのサポートがあり、次のような URL を使用するだけです。

page2.html?#tabPanelID

たとえば、タブに次のリンクがある場合、 href="#tab3" それはに行きます <div id="tab3"> その場合、あなたのURLは次のようになります page2.html#tab3, 、このリンクをチェックしてください: http://jqueryui.com/demos/tabs/#tabs-3

デモの 3 番目のタブが直接開く様子がわかりますか?それが組み込みの動作です。

Answer 2

この方法を試してみてください...私は知っている、それは少し長い息切れsはなく、少なくとも、あなたはJSタブがどのように実装されるかの各段階を見ることができます。

ページをリロードたら、あなたの文字列に証拠を追加...私はtab222を行っている。

次にIDあなたのタブのコンテンツのdivの私が行っている＃tab_2

あなたが持っているものに、メニュータグのhrefを変更...

$(document).ready(function(){

  if (/tab222/.test(self.location.href)) {
    $('#p_tabs li').removeClass('active');
    $('#p_tabs li a[href="#tab_2"]').parent().addClass('active');
    $('#tab_one').removeClass('active');
    $('#tab_two').addClass('active');
  };

});

vwala！希望に役立ちます。