Question

好吧，当谈到jQuery时，我是一个真正的初学者，虽然我已经尝试过搜索这个，但我似乎无法找到答案（我可能没有正确地说它）。

当点击其中一个li时，我想添加一个元素。但是，如果已经点击了li（并且已经添加了类），如果用户再次单击，我希望删除该类。到目前为止，这就是我所拥有的：

(function($){ 
   $(".list li").click(function() {
      $(this).addClass("hilite");
      $(this).attr("BeenClicked", "true");
   });
 })(jQuery); 

<ul class="list">
   <li> Something
   <li> Something else
</ul>

我需要创建基本上检查属性的代码，以查看“BeenClicked”是否设置为true。

Answer 1

你必须使用jQuery的toggleClass：

(function($){ 
   $(".list li").click(function() {
      $(this).toggleClass("hilite");
   });
})(jQuery);

Answer 2

使用.toggleClass()在每次点击时自动替换课程：

(function($){ 
   $(".list li").click(function() {
      $(this).toggleClass("hilite");
   });
 })(jQuery); 

<ul class="list">
   <li> Something
   <li> Something else
</ul>

无需单独存储"BeenClicked"属性。您可以使用.hasClass("hilite")方法随时查看其上是否有类。

此外，如果您要在其上存储数据，那么jQuery方式将采用.data()方法：$(this).data("BeenClicked", true);。

Answer 3

您可能想查看jQuery的toggleClass()方法。

http://api.jquery.com/toggleClass/

只需在点击处理程序中调用它即可。

如何单击并“取消选择”元素

3 个答案: