Question

我设置网站的方式，主页（“ /”）也是（“ / Dashboard”）上的MVC控制器/操作。我正在使用选项卡进行导航，因此仪表板对应于第一个选项卡。如果您随时单击“仪表板”，则我的代码将使该选项卡处于活动状态，并且如果导航至该选项卡，则其他任何选项卡也会处于活动状态。

但是，在主页上比较棘手，因为我的代码检查匹配锚标记的href以确定选项卡是否处于活动状态。如果我勾选“ /”，则所有href中的选项卡都将处于活动状态（例如，“ / Dashboard”，“ / Dashboard2”等）。

这是（编辑）整个代码：

$(document).ready(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 == "/") && (path.substring(0, href.length) == "/Dashboard")) {
            $(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 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')
        }
    });
}

编辑1：这是我的首页定位标记<a class="m-menu__link" href="/Dashboard">，所有其他定位标记在语法上都是相同的，唯一更改的是名称（例如，“ / Dashboard2”将是页面/ Dashboard2等）。

编辑2：如果第二个和第二个if / else条件可以使选项卡处于活动/非活动状态。

有什么建议吗？此代码不会触发。如果我仅使用“ /”部分，则所有选项卡均处于活动状态。

编辑3：这是HTML在首页上的样子（应用了最后的else）：

<ul class="toptab m-menu__nav  m-menu__nav--submenu-arrow">
    <li class="m-menu__item m-menu__item--submenu m-menu__item--tabs">
        <a class="m-menu__link" href="/Dashboard">
            Dashboard
        </a>
        ...
    </li>
</ul>

Answer 1

我能够在第一个if语句中使用它来使其工作：

if ((path == '/') && (href == '/Dashboard'))

jQuery：尝试在首页上插入css并且锚标记HREF包含某些内容

1 个答案: