zoukankan      html  css  js  c++  java
  • jQuery队列(三)

    看了一下队列剩下的几个方法,在没有应用场景的情况下,对它所做的一些处理不能明白。后续希望可以通过动画部分代码的阅读能搞清楚这些处理的意义。
    jQuery.fn.extend({

    // 推迟队列中函数的执行

    delay: function( time, type ) {
      // 估计需要看了动画部分的代码才能知道是怎么回事
      time = jQuery.fx ? jQuery.fx.speeds[ time ] || time : time;
      type = type || "fx";
      // 推一个匿名函数到栈中,该函数通过setTimeout延迟特定的函数执行。
      return this.queue( type, function( next, hooks ) {
        var timeout = setTimeout( next, time );
        // 给hooks绑定一个stop方法,目的是特定情况下清楚延时?
        hooks.stop = function() {
          clearTimeout( timeout );
        };
      });
    },
    // 将空数组推入到栈中,内部通过调用cache机制的access方法用空数组替换掉原本的数组队列内容
    clearQueue: function( type ) {
      return this.queue( type || "fx", [] );
    },
    // 该方法通过调用回调机制来完成对队列内函数执行完成之后的回调
    promise: function( type, obj ) {
      var tmp,
      count = 1,

      // 得到一个Deferred对象
      defer = jQuery.Deferred(),
      elements = this,
      i = this.length,

      resolve = function() {
        if ( !( --count ) ) {

          // 将回调的触发环境传进去
          defer.resolveWith( elements, [ elements ] );
        }
      };

      // 参数调整

      if ( typeof type !== "string" ) {
        obj = type;
        type = undefined;
      }
      type = type || "fx";

      while( i-- ) {

        // 等到队列为空时,标记为resolve,说明队列执行完毕,可以准备执行回调。
        tmp = data_priv.get( elements[ i ], type + "queueHooks" );
        if ( tmp && tmp.empty ) {
          count++;
          tmp.empty.add( resolve );
        }
      }
      resolve();

      // 返回promise对象,用户其它地方的监控
      return defer.promise( obj );
      }
    });

  • 相关阅读:
    javascript基础
    杂谈
    六大设计原则
    MVC的理解
    不错的资源哦
    平时你从哪里获取前端知识?
    网站背景平铺
    js 获取节点
    自适应后的页面用户点击后会放大
    innerHTML的运用
  • 原文地址:https://www.cnblogs.com/charling/p/3489926.html
Copyright © 2011-2022 走看看