javascript - 活动状态不适用于第一次访问

Question

我有一个带有几个链接的菜单。我只想突出显示我当前的链接，所以我将此代码用于活动状态。它工作正常。

小提琴

$(function () {
    $('.nav li a').each(function () {
        if ($(this).prop('href') == window.location.href) {
            $(this).addClass('home-active-link');
        }
    });
});

问题 当我把它放在本地主机上并测试时。它不适用于第一次访问。请看一下这个截图。

但是当我浏览页面并回到家时，它工作正常。有什么建议可以解决这个问题吗？

标签： javascriptjqueryhtmlcss

Answer 1

您可以调试下面给出的代码

jQuery(document).ready(function($){
    setTimeout(function(){
    $('.nav li a').each(function () {

        console.log($(this).prop('href')); // alert($(this).prop('href'))
        console.log(window.location.href); // alert(window.location.href); 


        if ($(this).prop('href') === window.location.href) {
            $(this).addClass('home-active-link');
        }
    });
    },30);
});