Javascript 简单jQuery addClass（）不'；我好像不工作

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

这是我的脚本，所有选择器都工作正常，if语句也完成了这项工作，但是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>

---

可能应该将活动类应用于li。。假设您的逻辑正确，并且该类应应用于li（没有html和css很难说）：

---

将

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>

如果无法更改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");
        }
    });

---

我不确定我是否完全明白这个问题，但我会选择这样的方式：

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

$（窗口）。加载（函数（）{
var url=window.location；
$（'#导航a'）.filter（函数（）{
返回this.href==url；
}).parents（“li”）.addClass（“活动”）；
});

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

像index.phpinclidemenu.php 您必须使用此scritp来检测加载的url，并将类菜单更改为活动类

---

谢谢你，你的代码很好用

这是对你的脚本的改进，如果你在CSS上很好地定义了选择器'active'，这将非常有效。这似乎对我也不起作用，我很好地定义了'active'类（如果菜单上添加class='active'，我可以看到更改）@请不要让

typeof

看起来像一个函数（括号）。不是函数，而是运算符。还有，

else

块究竟是如何到达的？如果

A不是B

或A是B`，则没有剩余选项。谢谢@RobW。重新编辑。我用OP提供的代码在我的PC上创建了一个演示，效果很好。错误可能在其他地方。我打算将该类应用于锚点。。我将在主帖子中添加html和css，因为我已经更新了html代码，css目前不需要，因为问题是html代码中没有添加类，无论它是否定义这里有一个JSFIDLE将类添加到锚。我已经更新了我的最终代码，现在一切都很好，这段代码好吗？它是有效的，但它就是你所说的“有效的”吗？如果你的代码是有效的，并且没有控制台错误，那么你就可以开始了！如果其中一个答案解决了您的问题，请将其标记为已接受！我用你的脚本创建了一个测试用例，效果很好。这很好，哈哈，除了这个部分，我看不出和我的有什么不同。。

<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");
        }
    });

   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");
        }
    });

$("#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>