Question

我正在使用一个选项卡菜单导航系统，每个选项卡下都有子菜单，但每个选项卡都链接到单独的页面（即，选项卡菜单不是具有多个选项卡的页面来显示/隐藏内容）。

以下代码将设置/删除活动类为<li>，以便当您在该页面或子页面上时，一个选项卡处于活动状态。我遇到的问题是第一次加载到站点（“ /”）时，链接到该主选项卡的主选项卡未激活。这是代码：

$(function () {
    setNavigation();
});

function setNavigation() {
   var path = window.location.pathname;
    path = path.replace(/\/$/, "");
    path = decodeURIComponent(path);

    $(".toptab a").each(function () {
        var href = $(this).attr('href');
        if (path.substring(0, href.length) === href) {
            $(this).closest('li').addClass('m-menu__item m-menu__item--submenu m-menu__item--tabs m-menu__item--active m-menu__item--active-tab');
        }
        else {
            $(this).closest('li').addClass('m-menu__item  m-menu__item--submenu m-menu__item--tabs')
        }
    });
}

我尝试对&&语句执行if并检查路径名=“ /”，但是语法错误（或者无法这样做）。

我想做的是在加载网站时，突出显示第一个选项卡为活动状态。任何帮助表示赞赏。

此“活动菜单项”代码的信用：https://www.infoworld.com/article/3304440/application-development/setting-an-active-menu-item-based-on-the-current-url-with-jquery.html。

Answer 1

使用此代码进行测试时，您要删除“ /”：

path = path.replace(/\/$/, "");

替换为：

path = path.replace(/(?!^)\/$/, "");

（此代码(?!^)表示它不是第一个字符。）

jQuery-尝试向函数添加路径“ /”以添加活动的CSS类

1 个答案: