Question

我有两个DIV，我想在点击它（它的工作）时将DIV颜色改为绿色。我正在计算div的点击次数，如果DIV已经是绿色，我想停止计数。

＆＃13;

var counter = 0;
$(function() {
  $(".tile").click(function() {
    if ($(this).css('background-color') == 'rgb(250,0,0)') {
      $(this).css('background-color', '#008000');
      counter++;
      $(this).append("/" + counter);
    } else {
      alert("Already colored!");
    }
  });
});

＆＃13;

div {
  width: 90vh;
  height: 10vh;
  margin: auto;
  border: 3px solid black;
  padding: 25px 25px 25px 25px;
  background-color: rgb(250, 0, 0);
  display: table-cell;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class='tile'></div>
<div class='tile'></div>

＆＃13;

因此，如果背景为红色(250,0,0)，则将div重新着色为绿色并将div文本更改为1.但如果div不是红色（已经是彩色的），并且如果我单击绿色div则显示警报消息。任何想法如何解决这个问题？我想我的IF错了。

Answer 1

如果要添加/删除样式，请使用CSS类：

CSS

.red-bg
{
   background-color: red;
}

.green-bg
{
   background-color: green;
}

的Javascript

if ($(this).hasClass('red-bg'))
{
    $(this).removeClass('red-bg')
           .addClass('green-bg');
}

与jQuery的Changin DIV背景颜色

1 个答案: