简单的jQuery addClass(）似乎不起作用

simple jQuery addClass() doesn't seem to be working

本文关键字：不起作用 jQuery addClass 简单      更新时间：2023-09-26

我希望能够确定用户当前所在的页面。 向导航链接添加独特样式形式的简单指示器 用户当前正在查看其上下文

这是我的脚本，所有选择器工作正常，如果语句也可以完成这项工作，但addClass（）函数什么都不做..这是我的代码： 

<script>
$(document).ready(function(){
    var pathname = window.location.pathname;
    $("#links ul li a").each( function() {
        var href= $(this).attr("href");
        if (pathname.indexOf(href) >= 0){
            $(this).addClass("active");
        }
    } );
});
</script>

    <nav id="links">
    <ul>
        <li><a href="index.php">Home</a></li>
        <li><a>About</a></li>
        <li><a>Contact</a></li>
    </ul>
</nav>

.HTML：

让它工作，这是我的最终代码，是否需要任何改进？ 

$(document).ready(function(){
    var pathname = window.location.pathname;
    var onDomain=true;
    $("#links ul li a").each( function() {
        var href= $(this).attr("href");
        if (href != undefined && pathname.indexOf(href) >= 0){
            $(this).addClass("active");
            onDomain=false;
        }
    });
    if (onDomain){
        $("#links ul li:first-child a").addClass("active");
    }
});

将href分配给a;

<nav id="links">
    <ul>
        <li><a href="index.php">Home</a></li>
        <li><a href="">About</a></li>
        <li><a href="">Contact</a></li>
    </ul>
</nav>

然后尝试：

   var pathname = window.location.pathname;
   $("#links ul li a").each( function() {
        var href= $(this).attr("href");
        if (href.length && pathname.indexOf(href) >= 0){
            $(this).addClass("active");
        }
    });

如果您无法更改 HTML，请尝试如下操作：

   var pathname = window.location.pathname;
   $("#links ul li a").each( function() {
        var href= $(this).attr("href");
        if (href != undefined && pathname.indexOf(href) >= 0){
            $(this).addClass("active");
        }
    });

很可能活动类应该应用于 li.。假设你的逻辑是正确的，并且该类应该应用于 li（没有 html 和 css 很难分辨）：

if (pathname.indexOf(href) >= 0){
        $(this).parent().addClass("active");
}

var loc = ''+( $(location).attr('href').split('/').slice(-1) );
if( typeof loc !== 'undefined'){
    $("#links li").find("a[href='"+loc+"']").each(function(){
        $(this).addClass("active");
    });
}else( typeof loc === 'undefined' ){
    $("#links li a:eq(0)").addClass("active"); // if you use 'home' as your first.
}

我不确定我是否理解这个问题，但我会选择类似的东西：

$("#links ul li a").filter( function() {
    return window.location.pathname.indexOf(this.href) != -1;
}).addClass('active');

<script type="text/javascript">
$(window).load(function() {
                  var url = window.location;
                    $('#nav a').filter(function() {
                        return this.href == url;
                    }).parents("li").addClass('active');
            });
</script>

这是工作在对菜单使用外部文件时使用此脚本

喜欢索引.php包括菜单.php您必须使用此 SCRETP tu 检测 URL 已加载，并且类菜单更改为活动类。

谢谢你代码悖论你的代码是工作

相关文章：