jquery - Jquery タブ: タブに直接リンクする方法

Question

私はこのスクリプトを手に入れました: http://www.htmldrive.net/items/show/542/Simple-Tabs-w-CSS-jQuery.html

今、私は疑問に思っていました: タブへのリンクを作成することは可能ですか? example.com/#tab4 のようなもの

ありがとう、マリアーノ

Answer 1

まず、次の方法でハッシュの変更を検出する必要があります。

$(window).bind('hashchange', function () {

  //your code here...

});

次に、window.location.hashを取得し#hash、それを使用して、コード内のクリック イベントと同じことを行うことができます。

次のようなものが得られます。

$(window).bind('hashchange', function () {
    hash = window.location.hash;
    if (hash) {
        elem = $('ul.tabs li:has(a[href="'+hash+'"])'); //Select the li targeted
        $("ul.tabs li").removeClass("active"); //Remove any "active" class
        elem.addClass("active"); //Add "active" class to selected tab
        $(".tab_content").hide(); //Hide all tab content
        var activeTab = elem.find("a").attr("href"); //Find the rel attribute value to identify the active tab + content
        $(activeTab).fadeIn(); //Fade in the active content
        return false;
    };
});

参考文献:

http://api.jquerymobile.com/hashchange/

http://api.jquery.com/bind/