javascript - 如何根据页面 url 显示或隐藏选项卡

Question

这是我的代码，用于翻转选项卡和选项卡下的内容:

$(function () {
    $('#tabs li a').click(function (e) {
        e.preventDefault();
        $('#tabs li, #content .current').removeClass('current');
        $(this).parent().addClass('current');
        var currentTab = $(this).attr('href');
        $(currentTab).addClass('current');
    });
});

我有以下代码可以确定用户位于网站的哪个部分:

$(window).load(function () {
    var homeTab = ["home1", "home2", "home3", "home4", "home5"];
    var recruitingTab = ["rec1", "rec2", "rec3", "rec4", "rec5"];
    var adminTab = ["adm1", "adm2", "adm3", "adm4"];

    var pathName = getPageName(window.location.pathname);
    alert(pathName);

    if ($.inArray(pathName, homeTab) != -1) {
        alert("at home tab");
    }
    if ($.inArray(pathName, recruitingTab) != -1) {
        alert("at recruiting tab");
    }
    if ($.inArray(pathName, adminTab) != -1) {
        alert("at admin tab");
        $("#tab li#tHome").removeClass('current');
        $("#tab li#tRecruiting").removeClass('current');
        $("#tab li#tAdminControls").addClass('current');
    }
});

如何将原始代码添加到 document.ready 函数中以实现上述功能？

编辑:我更新了上面的代码以查看它是否有效，但它不起作用。 :/

Answer 1

使用位置哈希要容易得多:

http://__someurl__#menustate

然后，您可以将路径与菜单状态分离，这样您就不再需要跟踪哪个路径转换为哪个菜单状态。

var menustate = document.location.hash;
$('.' + menustate).addClass('active');

然后你可以使用任何你想要的网址:

www.mysite.com/somepage#recruiting

然后，您可以检查加载时的哈希值，也可以更改它，并使其在单个页面中可添加书签。