javascript - 如何在 jQuery 中删除以前的事件类

Question

我制作了一个列表，当我单击它时，列表中会切换类active，但当我单击不同的元素时，以前的元素仍然包含active类

<ul>
    <li class="click_me">Here </li>
    <li class="click_me">Here </li>
    <li class="click_me">Here </li>
    <li class="click_me">Here </li>
</ul>

$(document).ready(function()
{
    $('.click_me').click(function()
    {
        $.each(function()
        {
            $('.click_me').toggleClass('active');
        });
        $(this).toggleClass('active');
    });
});

<style>
.active
{
    background-color: red;
}
</style>

我想要的是，当我点击不同的 li 元素时，之前的 li 的 active 类必须被切换出来。抱歉英语不好! 我尝试添加每个循环，但没有成功。

Answer 1

要使其正常工作，您只需从任何已拥有该类的元素中删除 .active 类(不包括应切换的当前元素)。试试这个:

$('.click_me').click(function() {
  $('.active').not(this).removeClass('active');
  $(this).toggleClass('active');
});

.active {
  background-color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li class="click_me">Here</li>
  <li class="click_me">Here</li>
  <li class="click_me">Here</li>
  <li class="click_me">Here</li>
</ul>