添加类但单击后删除类

Question

我有一个问题，jQuery addClass代码为我的div添加了类但是在点击类之后就消失了。这是一个多页网站。

$(document).ready(function(){
  $(".left-menu-icon").click(function(){
    $(this).addClass("l-animals-a");
  });
});

<a href="animals.html">
  <div class="left-menu-icon l-animals"></div>
</a>

Answer 1

正如Culyx正确评论：这里发生的是您点击<a>标记实际上是将您重定向到animals.html页面。我假设这是您当前所在的页面，所以实际发生的是页面令人耳目一新。

您必须通过在点击事件中捕获事件来阻止页面执行重定向：

$(".left-menu-icon").click(function(e){
  e.preventDefault();
  $(this).addClass("l-animals-a");
});

为了捕获事件，我正在使用event.preventDefault()函数。 MDN文档描述了此功能如下：

  

如果事件可以取消，则取消该事件，而不会停止事件的进一步传播。