jq Deffered函数 有返回值的异步函数 执行完成后再执行下一步

Deferred的介绍可以看API文档,网址为:http://www.runoob.com/jquery/misc-jquery-deferred.html

$.Deferred() 是一个构造函数,创建一个新的Deferred(延迟)对象,用来返回一个链式实用对象方法来注册多个回调,并且调用回调队列,传递任何同步或异步功能成功或失败的状态。 

在使用时有时可能会遇到异步执行的函数,例如forge中的search函数,但是我们又要求拿到异步函数执行的结果后再去执行下一步,这时候就需要用到Deferred()函数。

关于Deferred()函数的基本使用可以参考我的上一篇文章https://blog.csdn.net/tianzhen620/article/details/85267759,里面进行了详细的介绍。

本篇文章主要介绍多个有返回值的异步函数执行完成后再继续执行下一步:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <!--引用jQuery1.7以上版本-->
        <script type="text/javascript" src="js/jquery-1.11.3.min.js"></script>
        <script>
            //自定义一个异步函数
            function yibujiazai(bb) {
                var dtd = $.Deferred(); //定义一个Deferred延迟对象
                var tasks = function() {
                    var aa = [1, 2, 3];
                    alert(bb);
                    alert("执行完毕!");
                    dtd.resolve(bb); // 改变deferred对象的执行状态
                };
                setTimeout(tasks, 5000);
                return dtd;
            }
            function cc() {
                var bb = [4, 5, 6]; 
                var dd = [7, 8, 9]; 
                //Deferred()函数格式  ,when()当函数异步加载成功后执行 done里面的函数;函数异步加载失败时执行 fail里面的函数。
                //when()里面不能定义变量。when()里面可以写多个函数。
                //when()里面调用了两次异步执行函数,并且都有返回值,可以放多个异步执行函数
                //执行过程为当两个异步函数都加载成功后执行done函数,当两个异步函数有一个不成功或者都不成功时执行fail函数
                $.when(yibujiazai(bb),yibujiazai(dd)) 
                //function(aa,ee)函数,第一个形参代表when()中第一个异步执行函数的返回值,第二个形参代表when()中第二个异步执行函数的返回值,
                .done(function(aa,ee) { 
                    alert(aa);
                    alert(ee);
                    alert("哈哈,成功了!");
                }) 
                .fail(function() {
                    alert("出错啦!");
                });         
            }
        </script>
    </head>
    <body>
        <input type="button" value="异步加载" οnclick="cc()" />     
    </body>
</html>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值