Question

这是一个相当简单的问题。但我一直无法修复。我创建了这个实验室网站：http://www-plb.ucdavis.edu/Labs/sundar/ 我想要＆＃34; Home＆＃34;导航按钮在页面加载时变为黄金，而无需单击按钮。

我编写了一个JQuery函数来分配一个类，使当前页面在导航金色上如下所示。但这只发生在点击上。我希望在加载时分配活动类。谢谢！

$(document).ready(function(){
    $('#nav a').each(function(index) {
        if(this.href.trim() == window.location)
            $(this).addClass("active");
    });
});

Answer 1

你家的原因＆＃39;按钮在页面加载时不会变为金黄色，因为当前页面为http://www-plb.ucdavis.edu/Labs/sundar/index.html时该按钮的链接为http://www-plb.ucdavis.edu/Labs/sundar/，因此对this.href.trim() == window.location的检查失败。

您可以通过更改

中的主页按钮的链接来解决此问题

<a href="index.html">Home</a>

到

<a href="http://www-plb.ucdavis.edu/Labs/sundar/">Home</a>

Answer 2

$('#nav a').each(function(index) {
    console.log(this.href.trim());
    console.log(window.location.toString());
});

如果我在http://www-plb.ucdavis.edu/Labs/sundar/

运行代码

http://www-plb.ucdavis.edu/Labs/sundar/index.html

http://www-plb.ucdavis.edu/Labs/sundar/

...

如果我在'Home'（http://www-plb.ucdavis.edu/Labs/sundar/index.html）

运行代码

http://www-plb.ucdavis.edu/Labs/sundar/index.html

http://www-plb.ucdavis.edu/Labs/sundar/index.html

...

所以，只是你的代码错了。

为什么不手动将类active放在每个html上？

在加载时分配类的脚本

2 个答案: