如何在jQuery .each()的每次迭代之间添加暂停? [英] How to add pause between each iteration of jQuery .each()?

问题描述

我要获取一个jQuery对象数组，然后通过.each()修改数组中的每个单独的jquery.

I'm grabbing an array of jQuery objects and then via .each() modifying each individual jquery with in the array.

在这种情况下，我更新了类名称，以触发-webkit-transition-property来利用css转换.

In this case I'm updated the class names to trigger a -webkit-transition-property to utilize a css transition.

我希望在每次CSS转换开始之前先暂停一下.我正在使用以下内容，但是每次更新之间都没有延迟.相反，它们似乎都在一次更新.

I'd like there to be a pause before each css transition begins. I'm using the following, but there is no delay in between each update. Instead, they all appear to be updating at once.

function positionCards() {
  $cards = $('#gameboard .card');
  $cards.each(function() {
      setTimeout( function(){ addPositioningClass($(this)); }, 500 )
  });
}

function addPositioningClasses($card){
  $card
    .addClass('position')
}

我希望setTimeout可以解决此问题，但似乎无法正常工作.有没有一种方法可以在每个对象的每个CLASS名称更新之前完成暂停?

I was hoping setTimeout would solve this, but it doesn't seem to be working. Is there a way to accomplish the pause before each CLASS name update of each object?

推荐答案

我将其添加为评论，但现在我已正确阅读并回答了自己的问题，这可能会起作用:

I added this as a comment but now that I have read it correctly and answered my own question this would probably work:

function positionCards() {
  var $cards = $('#gameboard .card');

  var time = 500;

  $cards.each(function() {
      setTimeout( function(){ addPositioningClass($(this)); }, time)
      time += 500;
  });
}

这篇关于如何在jQuery .each()的每次迭代之间添加暂停?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！