Question

请看这个小提琴http://jsfiddle.net/M783F/5/

<div class="stage">
  <div class="flashcard">
    <div class="front">
     <p>Front</p>
  </div>
  <div class="back">
   <p>Back</p>
  </div>
 </div>  
 </div>

$(document).ready(function() {
 $('.flashcard').on('click', function() {
  $('.flashcard').toggleClass('flipped');
});
});

通过上面的代码，当有人点击div时，当前正在翻转前后div。

我希望在一段时间（比如5秒）后自动翻转前后div

Answer 1

您可以使用setTimeout功能。它在指定的延迟（毫秒）后调用函数或执行代码片段。

setTimeout(function(){$('.flashcard').toggleClass('flipped');}, 5000);

JSFiddle

Answer 2

使用setInterval。它将在每5秒后翻转div。

$(document).ready(function() {
  setInterval(function() {
    $('.flashcard').toggleClass('flipped');
  },5000);
});

如果您只想翻转一次，请使用setTimeout。

Answer 3

SetTimeOut执行一次方法，setInterval每隔n秒执行一次

setInterval(function(){$('.flashcard').toggleClass('flipped')},5000);

以下是Fiddle

Answer 4

JS Fiddle is Here 使用set Interval。

$(document).ready(function() {
  $('.flashcard').on('click', function() {
    $('.flashcard').toggleClass('flipped');
  });
});

5秒后使用jquery翻转div

4 个答案: