Question

我有一个div元素列表，当我点击这个div时，出现了“selected”类。我如何检查这个类是否出现以及选择了什么样的div。

<div class="swatch-attribute-options">
<div class="swatch-option color">
<div class="swatch-option color">
<div class="swatch-option color">
<div class="swatch-option color">
</div>

单击某些div，添加选中的类

那么，我该如何检查这个类是否已添加，并确定确切的div。

感谢。

Answer 1

我试着了解你需要什么，然后为你创建一个简单的演示

＆＃13;

$(document).ready(function() {
  // when click the box class
  $('.box').click(function() {
    // check has selected class ?
    check = $(this).hasClass('selected');
    if (check) {
      // remove selected class
      $(this).removeClass('selected');
    } else {
      // add and log selected class
      console.log('div ' + $(this).html() + ' Selected !')
      $(this).addClass('selected');
    }
  })
})

＆＃13;

.box {
padding: 10px;
border: 1px solid silver;
}

.selected {
border: 1px solid red !important;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="box">One</div> <br/>
<div class="box">Two</div> <br/>
<div class="box">Three</div> <br/>
<div class="box">Four</div> <br/>
<div class="box">Five</div> <br/>

＆＃13;

Answer 2

很难知道期望的结果是什么，但是如果你想根据类是否已经应用来添加或删除类，你可以使用jQuery toggleclass。

http://api.jquery.com/toggleclass/

$('.swatch-option').click(function(){
  $(this).toggleClass('selected');
});

单击后出现类的Jquery

2 个答案: