Jquery选项卡:如何直接链接到选项卡

时间:2013-07-16 11:14:07

标签: jquery tabs hyperlink

我收到了这个脚本:http://www.htmldrive.net/items/show/542/Simple-Tabs-w-CSS-jQuery.html

现在我想知道:是否可以创建指向标签的链接?像例如exemple.com/#tab4

谢谢, 马里亚诺

1 个答案:

答案 0 :(得分:1)

首先,您必须使用以下方法检测哈希更改:

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

  //your code here...

});

然后使用window.location.hash,您将获得#hash,并且您可以使用它来执行与代码中的click事件相同的操作。

你会得到这样的东西:

$(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/