Question

我认为这个问题可能已被提出，但我找不到任何有效的答案，也没有能够反映我问题的问题。我的问题是我目前有2 <div>个，我希望他们在onClick事件后切换课程。
例如，当我点击一个div时，我希望它有一个名为isSelected的类，如果第二个div有类，我想删除它。我不是简单地希望点击的div切换isSelected，我希望其他div“松散”它的isSelected类。

Answer 1

试

$(".divclass").click(function(){
   $(".divclass").removeClass("isSelected");
   $(this).addClass("isSelected");
});

假设这两个兄弟姐妹有同一个班级divclass

Answer 2

您可以简单地使用类选择器来定位具有特定类的任何元素，并将其删除....

$("#myDiv").on("click", function() {
    $(".isSelected").removeClass("isSelected");
    $(this).addClass("isSelected");
});

无论您有多少可选择的div，这都会有效...

Answer 3

$("div").click(function(){
   $("div").removeClass("isSelected");
   $(this).addClass("isSelected");
});

.isSelected {
    background-color:red; 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="">test 1</div>
<div class="">test 2</div>
<div class="">test 3</div>

Answer 4

假设一个div总是拥有你可以使用的课程

$("#myDiv").on("click", function() {
    $('#div1, #div2').toggleClass('isSelected');
})

Answer 5

这应该做你需要的。

$("div").click(function(){
   $("div").removeClass("isSelected");
   $(this).addClass("isSelected");
});

.isSelected {
    background-color:blue; 
}

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

如何使用jQuery在两个元素之间切换类

5 个答案: