javascript - 如何使用 setTimeout 来切换 jquery 中的类？

Question

此代码使用鼠标单击来切换图像上的类。我希望使用 setTimeout 自动发生此转换。

$(document).ready(function() {
  $("#cf_onclick").click(function() {
    $("#cf2 img.top").toggleClass("transparent");
  });
});

Answer 1

$(document).ready(function() {
  $("#cf_onclick").click(function() {
    setTimeout(function() {
      $("#cf2 img.top").toggleClass("transparent");
    }, 1000);
  });
});

.transparent {
  opacity: 0.5;
  filter: alpha(opacity=50);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id='cf2'>
  <img class='top' src="https://loremflickr.com/640/360
" alt="Image not found!" height="100" width="100">
</div>
<button id='cf_onclick'>Click Me</button>

注意:- 您可以使用 setTimeout 设置图像功能。