Question

这应该很简单。

我有一个带有多个div的ajax返回字符串。我需要计算字符串中的每个div（所以如果有必要，我可能需要创建一个数组），然后每隔x秒用一个.delay（'200'）;每个div滑动一次。

请记住，每次返回时ajax返回可能不同，因此它必须适用于x个div。

例如


// For testing lets pretend ajax.return is
ajax.return = '<div>BLEH CONTENT</div> <div>BLEH CONTENT</div>';

var com = $(ajax.return).hide();
com.prependTo('#container').slideDown('fast');

现在我的代码显然对ajax.return中的所有div进行了一次快速slideDown，它将它视为一个字符串并预先填充整个字符串。

有人可以帮我为字符串中的每个div创建一个循环，并为每个幻灯片应用一个slideDown，每个幻灯片之间延迟1或2秒。

Answer 1

<强> Working Demo

var a = '<div>BLEH CONTENT</div><div>BLEH CONTENT</div>';

$(a).prependTo('#container').hide().each(function(i){
    var self = $(this);
    window.setTimeout(function() { self.slideDown('fast'); },1000*i);
});

取决于你有多少div，设置多个setTimeout可能会成为一个问题。我不是太确定在任何时候都可以设置多少时间而不会严重影响时间。有人评论吗？

Answer 2

也许是递归的东西，像这样（测试过）：

ajaxret = $('<div>BLEH CONTENT</div><div>BLEH CONTENT</div>').hide();
ajaxret.prependTo('#container');

var toSlide = $('#container div'); // add .andSelf() to include container 
var i = 0;
( function revealNext() {
    toSlide.eq( i++ ).delay('1000').slideDown('fast', revealNext);
//           each div        1sec      
})();

你可以用选择器等更简洁一点，但是你得到了一般的想法。

Answer 3

从头到尾：

$('div', ajax.return).each(function() {
  $(this).prependTo('#container').slideDown('fast'); 
});

AjQuery的jQuery slideDown返回，有div延迟

3 个答案: