码迷,mamicode.com
首页 > Web开发 > 详细

js中的队列

时间:2014-12-18 13:17:18      阅读:217      评论:0      收藏:0      [点我收藏+]

标签:style   blog   ar   io   color   使用   sp   for   on   

如果有5个隐藏的div,要让它们依次显示,通常的做法是要一个一个嵌套在回调函数里面,这样导致代码看起来非常不直观。

$("#div1").slideDown(1000,function(){
   $("#div2").slideDown(1000,function(){

    ...

    ...

   });

});

这个情况下,就可以使用队列,此时需要借助一个辅助对象,假设是$("#queueHelper"):

        var divs = $("div");
        divs.hide();
        for (var i = 0; i < divs.length; i++) {
            $("#queueHelper").queue(function () {
                divs.eq(i).slideDown(5000);
            });
        }
        for (var i = 0; i < divs.length; i++) {
            $("#queueHelper").dequeue();
        }

它思路就是找到一个辅助对象,向它一次性插入需要执行的动作,然后再一次性取出来。

在插入队列的时候,只是把方法保存进去。而等到出列的时候,才开始真正执行,并且是等待前一个方法执行完,才会执行后一个方法。

 

辅助对象的目的就是为了把所有函数都集中到同一个队列上,甚至可以直接用$("#div1")作为辅助对象。

如果没有把所有函数集中在同一个队列,而是分5个队列的话,那5个队列就会同时开始执行,看到的效果就是同时执行。

 

js中的队列

标签:style   blog   ar   io   color   使用   sp   for   on   

原文地址:http://www.cnblogs.com/dengshaojun/p/4171378.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!