Question

我有一个导航菜单，如：

<div class="my_menu">
  <ul>
    <li><a href="http://localhost/en/about-us">About Us</a></li>
    <li><a href="http://localhost/en/contact">Contact</a></li>
  </ul>
</div>

我正在尝试编写一个函数，当它与页面url匹配时，将一些活动类添加到菜单中。

$(".top_navigation li a").filter(function() {
    alert($(this).href);
    alert($(location).attr('href'));
    return $(this).href() === $(location).attr('href');
  }).addClass('newClass');

我做错了什么？

Answer 1

您可以使用location.href直接访问页面网址，无需jquery。

要获取dom元素的属性，可以使用attr

 $(this).attr('href')

这应该有效：

$(".top_navigation li a").filter(function() {
    return $(this).attr('href') === location.href);
}).addClass('newClass');

Answer 2

这是一个小的，稍微简单的jQuery片段，可以做你期望的事情：

$(".topnavigation li a").each(function() {
    if($(this).attr("href") == window.location) {
        $(this).addClass("newClass");
    }
});

演示：little link。

我希望能帮到你！

Answer 3

这样做。

$(".top_navigation li a").addClass(function() {
    return this.href === location.href ? "newClass" : "";
});

通过检查匹配当前标题来添加类到锚点？

3 个答案: