jquery - nav.php 中的 addClass 和 removeClass

Question

我的根目录中有一个 nav.php，我在每个页面中使用

这样我可以在一个文件中进行编辑，并且更改会在整个站点中生效。我试图在鼠标单击时删除类并在新单击的菜单项上添加类。下面是代码，我只是无法让它工作。

<script>
    $('li').click(function(){
        $('li.active').removeClass('active');
            $(this).addClass('active');
    });
</script>

这是网址

http://newriverreleasing.com

谢谢

Answer 1

这有几个问题...

查询选择器 $('li') 肯定会匹配页面上的多个元素，因此您需要遍历所有元素并添加 click() 函数，例如：

$('li').each(function() {
  $(this).click(function(thisLi) {
    // assuming there is only one li.active...
    $('li.active').removeClass('active');
    thisLi.addClass('active');
  });
});

此外，您需要通过将其放入 $(document).ready() 函数或类似函数来将其加载到它匹配的元素上：

$(document).ready(function() {
    $('li').each(function() {
      $(this).click(function(thisLi) {
        // assuming there is only one li.active...
        $('li.active').removeClass('active');
        thisLi.addClass('active');
      });
    });
});