Question

我都是！

我有这个菜单：

  <ul id="navigation">
      <li><a href="index.php">Home</a></li>
      <li><a href="index.php?page=Entidad">Entidad</a></li>
  </ul>

使用jQuery，我可以在单击菜单项时应用类.active，如下所示：

  $(document).ready(function(){
      $("li a").click(function(){
           $(this).parent().find("li").addClass('active');   
      });
  });

它没有用，你能帮助我吗？

Answer 1

parent a li为find，因此您无需$(document).ready(function(){ $("li a").click(function(){ $(this).parent().addClass('active'); }); }); li。

<强> Live Demo

$(document).ready(function(){
      $("li a").click(function(event){
           $('#navigation li').removeClass();
           $(this).parent().addClass('active');
      });
});

修改要从之前的元素中删除该类并添加到当前

<强> Live Demo

{{1}}

Answer 2

处理点击a时，li是父项，所以只需执行以下操作：

$(this).parent().addClass('active');

你是否确定这一点，因为我认为让这个链接变得活跃是明智的？只是观察。

Answer 3

单击超链接后，您的页面将会刷新，因此此代码$(this).parent().addClass('active')将无效。

请改为尝试：

$(function() {
                var page = getParameterByName('page');
                $("#navigation a:contains('" + page + "')").parent().addClass('active');
            });

            function getParameterByName(name)
            {
              name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
              var regexS = "[\\?&]" + name + "=([^&#]*)";
              var regex = new RegExp(regexS);
              var results = regex.exec(window.location.search);
              if(results == null)
                return "Home";
              else
                return decodeURIComponent(results[1].replace(/\+/g, " "));
            }

Answer 4

它只是

$(this).parent().addClass('active'); //  $(this).parent() selects list element

无需再找到li元素。

选择了jQuery菜单项

4 个答案: