这是我试图将当前页面的导航栏<li>为活动的位置:

 $(document).ready(function () { $(".collapse navbar-collapse ul li a").each(function () { if ($(this).attr("href") == window.location.pathname) $(this).addClass("active"); }) }) 

所有代码都位于header.js文件中,我从开头的每个页面调用该文件以显示标题:

 <html> <body> <script type="text/javascript" src="Scripts/header.js"></script> </body> </html> 

问题是代码不起作用,我也不知道为什么。 我在错误地声明$(".collapse navbar-collapse ul li a")吗? 导航栏设置的方式是否不正确?

您有以下HTML:

<div class='collapse navbar-collapse'>

您正在使用此JS:

$(".collapse navbar-collapse ul li a")

尝试将上面的行更改为此:

$(".collapse ul li a")

...要么...

$(".collapse.navbar-collapse ul li a")

另外,您的if语句的结构看起来很差。

尝试更改此:

if ($(this).attr("href") == window.location.pathname)
    $(this).addClass("active");

对此:

if ($(this).attr("href") == window.location.pathname) {
    $(this).addClass("active");
}

那可能会也可能不会解决您的问题,但是尽管如此,它应该可以修复代码中的一些错误。

由于折叠导航栏折叠在同一元素中,因此您必须编写

$(".collapse.navbar-collapse ul li a")

在提供的代码中没有包含jQuery .js文件,但我认为您自己的代码中已经包含该文件

查看全文
  相关解决方案