JQuery切换和删除css类

JQuery toggle and remove css classes

本文关键字：css 删除 JQuery      更新时间：2023-09-26

我有以下CSS:

.red {background-color: #CC0000;}
.green {background-color: #009900;}

和我的HTML是:

div class="red" id="ch1">Content</div>
<div class="red" id="ch2">Content</div>
<div class="red" id="ch3">Content</div>
...
<div class="green" id="ch..">Content</div>
<div class="red" id="ch..">Content</div>

和我使用以下脚本更改div上的类:

$(document).ready(function() { 
$(".red , .green").click(function(){
    $(".green").removeClass("green").addClass("red");
     $(this).toggleClass('red green');
});   
});

工程很好地改变div类onclick从。红色到。绿色，但当我点击"绿色"的div不变成"红色"。换句话说，我想有或所有的"红色"或只有一个"绿色"的div如果我在CSS

中改变。red -。green的顺序，也没有任何效果。

任何想法吗?提前感谢

不包含被点击的元素…

$(".green").not(this).removeClass("green").addClass("red");

只能使用toggleClass()。因此，从您的代码中删除以下行$ (" .green ") .removeClass .addClass("绿色")("红");

解决方案:- 

$(document).ready(function() { 
    $(".red , .green").click(function(){
        $(this).toggleClass('red green');
    });   
});

这是你想要的吗?http://jsfiddle.net/k23g3ne4/

这是工作:

$(this).siblings('.red , .green')
  .removeClass("green")
  .addClass("red");
相关文章：