0

我有一个数组，它有 4 个子数组，我试图从每个数组中检索数据，延迟 scond，以及从数组中检索每个元素延迟 1 秒。

我做了一个函数，它可以工作，但数据的顺序不正确，任何人纠正这个函数以获得正确的有序数据，每个延迟 1 秒。

我也知道我的功能更大一些。任何给我一个非常短的方法来达到同样的结果。

功能：

var ar = [

    [
        Object= { el:'li',  x:0,  y:294},
        Object= { el:'li',  x:150,  y:294},
        Object= { el:'li',  x:300,  y:294}
    ],

    [
        Object= { el:'li',  x:0,  y:196},
        Object= { el:'li',  x:150, y:196},
        Object= { el:'li',  x:300, y:196}
    ],

    [
        Object= { el:'li',  x:0,  y:98},
        Object= { el:'li',  x:150,  y:98},
        Object= { el:'li',  x:300,  y:98}
    ],

    [
        Object= { el:'li',  x:0,  y:0},
        Object= { el:'li',  x:150,  y:0},
        Object={ el:'li',  x:300,  y:0}
    ]

]

    var length = ar.length;

for(i=0;i<length;i++){

    (function(i){

 setTimeout(function(){

     var minLength = ar[i].length;

     for(j=0;j<minLength;j++){
         (function(d){
             setTimeout(function(j){
                 console.log(ar[d][d])
             },1000*d)             

         })(j)
     }

    },2000*i)


    })(i)
}

我只是安慰结果。

jsfiddle

4

1 回答 1

1

如果你想每秒选择一个元素，你可以链接回调。在每个元素之后，为该行中的下一个元素设置动画，或者，如果没有，则为下一个（非空）行中的第一个元素设置动画。这样做的好处是任何延迟都会传播到后续动画：

var ar /* = ... */;

var i = 0;
var j = 0;

(function next(){
   console.log(ar[i][j]);
   j++;
   while(ar[i] && !ar[i][j]){ //can be optimised if every row has at least one element
     i++;
     j=0;
   }
   if(ar[i]){
     setTimeout(next);
   }
 })();

如果每个动画步骤恰好需要一秒钟，那么最好附加next到动画的完成处理程序以确保动画不会重叠（jQuery 支持）。

(function next(){
   j++;
   while(ar[i] && !ar[i][j]){ //can be optimised if every row has at least one element
     i++;
     j=0;
   }
   $(/*...*/).animate({/*...*/}, 1000, ar[i] ? next : null);
 })();
于 2012-11-19T11:48:24.070 回答