Question

我有以下标记

<div id="div1">
   <ul>
      <li><a href="#" id="id1">link1</a></li>
      <li><a href="#" id="id2">link2</a></li>
      <li><a href="#" id="id3">link3</a></li>
   </ul>
</div>

我想使用jQuery为点击的链接添加一个类，并从之前点击的链接中删除该类，例如

<li class="selected"><a href="#" id="id1">link1</a></li>
<li><a href="#" id="id2">link2</a></li>
<li><a href="#" id="id3">link3</a></li>

Answer 1

试试这个：

$('#div1 li').click(function(e) {
    $(this).addClass('selected').siblings().removeClass('selected');
});

或者，如果您要将click事件附加到a：

$('#div1 a').click(function(e) {
    e.preventDefault();
    $('#div1 a').removeClass('selected');
    $(this).addClass('selected');
});

Example fiddle

Answer 2

你可以这样做：

$('li a').click(function() {
    $('li a').removeClass('selected');
    $(this).addClass('selected');
});

即，首先删除所有类，然后将该类添加到已单击的类中。

jQuery - 在点击时向li添加类

2 个答案: