Question

$(document).ready(function() {
    if($('.tiger2').parents().hasClass("active")){
      /* when add active class then */
      /* only one time this alert or a function is cassed */
      alert("1");
    }
    $('button').click(function(){
        $('.parents2').addClass('active');
    });
});

.active{
  height: 100px;
  width: 100px;
  background: red;
  margin: 10px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>When ON click Add a class than get the style</title>
</head>
<body>
  <div class="parents1 active">
      <div>
          <div class="tiger1"></div>
      </div>
  </div>
  
  <div class="parents2">
      <div>
          <div class="tiger2"></div>
      </div>
  </div>
  
  <button>Click Me</button>
</body>
</html>

当通过javascript / Jquery添加类时，

做点什么 一直检查 选择器的有父母，活动类，然后调用一个函数我已经使用它的作品，但我不满足

**var count = true;
function myFunction() {
    setInterval(function(){
        if(*$('.tiger2').parents().hasClass("active")* && count){
            alert("1");
            count = false;
        } 
    }, 1000);
}
myFunction();**

check me on jsfiddle

Answer 1

当课程发生变化时，没有现成的方法来激活事件。但是你可以做的就是每次更新课程时触发自定义事件，这可以反过来执行所需的活动。

例如：

$(document).ready(function() {
    $('button').click(function(){
        $('.parents2').toggleClass('active');
        // Only fire if "active" class is present after toggle
        if($('.parents2').hasClass('active'))
           $(document).trigger('classActiveAdded');
    });
    $(document).on('classActiveAdded', function() {
    alert("1");
    });
});

.active{
  height: 100px;
  width: 100px;
  background: red;
  margin: 10px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>When ON click Add a class than get the style</title>
</head>
<body>
  <div class="parents1 active">
      <div>
          <div class="tiger1"></div>
      </div>
  </div>
  
  <div class="parents2">
      <div>
          <div class="tiger2"></div>
      </div>
  </div>
  
  <button>Click Me</button>
</body>
</html>

每次选择器的父母都有课时（即有效），然后调用一个函数

1 个答案: