jQuery - 点击更改颜色

Question

我正在查看一些jQuery，因为我想创建一个在单击时改变颜色的div。

我已经这样做了：

$(function() {  
$('.star').click(function(){
    $(this).css('background', 'yellow');

  });
});

它完美无缺！ 但是当我再次单击它时，我希望它删除背景颜色。这可能吗，你会怎么做那样的事情？

Answer 1

创建一个CSS类：

.clicked {
  background-color: yellow;
}

然后通过jQuery简单地toggle that class：

$('.star').click(function(){
  $(this).toggleClass('clicked');
});

Answer 2

您可以在点击功能中设置一个标志，然后添加一个if语句

if hasBeenClicked = true;
//...background color remove
else
//....background color changed to yellow

hasBeenClicked = true;

Answer 3

创建CSS类也是我的建议，但你也可以这样做“取消设置”黄色背景：

$(this).css('background', 'inherit');