Question

我无法在我点击的LI导航菜单中添加活动类。

当我点击WHAT WE DO上的home page时，它会跳转到what we do page，因此我需要WHAT WE DO中的菜单what we do page才能激活。

这是我的JSFIDDLE

JS

$( document ).ready(function() {        
  $( "#cssmenu a" ).click(function(e) {
  e.preventDefault();
  var navId = $(this).attr("href");
  var str = '.' + $(this).attr('id');
    $("html, body").animate({
      scrollTop: $(navId).offset().top
    }, 600);

    $(str).show();
    $(this).closest('ul').find('li').removeClass("active");
    $(str).find('li').removeClass("active");
    $(str).closest('ul').find('li').addClass("active");
  });
});

Answer 1

<强> Updated Fiddle

您需要在li中找到a - what we do page来添加该类。更改最后一行，

$(str).find('ul li a#'+$(this).attr('id')).parent().addClass("active");

或者只是

$(str).find('a#'+$(this).attr('id')).parent().addClass("active");

注意：您的标记包含无效的重复ID。

Answer 2

您对多个元素使用相同的ID。请删除它并为不同的元素使用不同的ID。

您可以使用以下jQuery添加活动类：

$(str).find('[href="'+navId+'"]').closest('li').addClass("active");

而不是

 $(str).closest('ul').find('li').addClass("active");

Working JSFiddle

注意：因为活动类的字体颜色为白色，因此在向li添加活动类后它不可见。

Answer 3

元素ID在整个文档中应该是唯一的。

如何在LI导航菜单中添加javascript添加类

JS

3 个答案: