整理一下关于jq队列和回调

整理一下关于jq队列和回调

jq队列

首先说一点jQuery的队列依赖缓存机制事件,它同时是animate的基础
它不像事件机制、缓存机制、回调机制一样有自己的命名空间,由于比较简单,所以直接挂在到$和jQuery对象上
它提供的基础方法有

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
jQuery.extend({
queue: function( elem, type, data ) {
  var queue;
   // 如果存在elem,也就是至少有一个参数
if ( elem ) {
     // 如果有第二个参数,使用第二个参数加上“queue”,否则使用“fx” + “queue”(动画队列的名称)
type = ( type || "fx" ) + "queue";
     // 到jQuery内部使用的data_priv缓存对象中去取已type为key的值
queue = data_priv.get( elem, type );
     // 如果存在第三个参数
if ( data ) {
      // 如果elem还没有在cache中存储过名为type的数据,或者需要存储的数据时数组
if ( !queue || jQuery.isArray( data ) ) {
queue = data_priv.access( elem, type, jQuery.makeArray(data) );
      // 否则,直接将data推入到队列中
} else {
queue.push( data );
}
}
     // 返回队列
return queue || [];
}
  }, // 将数据按照某种类型存储到elem上
dequeue: function( elem, type ) {}, // 从elem上删除某种类型的数据
_queueHooks: function( elem, type ) {} // 内部使用
});

jQuery.fn.extend({
queue: function( type, data ) {},
dequeue: function( type ) {},
delay: function( time, type ) {},
clearQueue: function( type ) {},
promise: function( type, obj ) {}
});

jq使用Deferred

再简单说一下 控制jq方法的运行顺序
使用Deferred(从jQuery 1.5.0版本开始引入的一个新功能)来控制
简单说一下使用方法:
首先注册var def = $.Deferred();
注册后var prs1 = def.then(自定义函数);
var prs2 = prs1.then(自定义函数); prs1函数执行完毕执行prs2函数
最后还需要触发这个注册 def.resolve(“0”);
即可
如上所述就可以控制程序的运行顺序了
说一下jq这部分的原理
deferred对象是一个延迟对象,意思是函数延迟到某个点才开始执行,改变执行状态的方法有两个(成功:resolve和失败:reject),分别对应两种执行回调(成功回调函数:done和失败回调函数fail)
deferred对象的多种方法,下面给大家总结一下啊

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
    (1) $.Deferred() 生成一个deferred对象。

  (2) deferred.done() 指定操作成功时的回调函数

  (3) deferred.fail() 指定操作失败时的回调函数

  (4) deferred.promise() 没有参数时,返回一个新的deferred对象,该对象的运行状态无法被改变;接受参数时,作用为在参数对象上部署deferred接口。

  (5) deferred.resolve() 手动改变deferred对象的运行状态为"已完成",从而立即触发done()方法。

  (6)deferred.reject() 这个方法与deferred.resolve()正好相反,调用后将deferred对象的运行状态变为"已失败",从而立即触发fail()方法。

  (7) $.when() 为多个操作指定回调函数。

除了这些方法以外,deferred对象还有二个重要方法,上面的教程中没有涉及到。

  (8)deferred.then()

有时为了省事,可以把done()和fail()合在一起写,这就是then()方法。

jq ajax回调

这方面我直接说一下使用方法

1
2
3
4
5
6
7
8
9
function test(callback) {
var lastCode = "";
$.ajax({async : false,url:"",success:function(result){
callback(result);
}});
}
test(function(result){
//可以做你想做的事情了
})