jQuery向当前li添加类并在li内部单击时删除pre li [英] jQuery add class to current li and remove prev li when click inside li a

问题描述

这是html:

<ul>    
    <li class="current"><a href="#">menu item</a></li>  
    <li><a href="#aba">menu item</a></li>
    <li><a href="#abb">menu item</a></li>
    <li><a href="#abc">menu item</a></li>
    <li><a href="#abd">menu item</a></li>
</ul>

如果我按'a'链接，它将为点击的li添加Class'current'并删除旧的li类吗? 这是我的尝试:

if I press 'a' link it will addClass 'current' to clicked li and remove old li class? this is my try:

$('ul li a').click(function(){
  $('ul li').removeClass('current');
  ... don't know here (add class to current li) ...
});

推荐答案

使用 .parent('li') 或 .closest('li') 以选择单击的<li>.

$('ul li a').click(function() {
    $('ul li.current').removeClass('current');
    $(this).closest('li').addClass('current');
});

这篇关于jQuery向当前li添加类并在li内部单击时删除pre li的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！