网站首页  汉语字词  英语词汇  考试资料  写作素材  旧版资料

请输入您要查询的范文:

 

标题 Jquery $when done then的用法详解
范文
    这篇文章主要介绍了Jquery $when done then的用法详解的相关资料,本文还通过一个例子给大家介绍jquery when then(done) 用法,需要的朋友可以参考下
    对于$.ajax请求来说,如果层级比较多,程序看起来会比较乱,而为了解决这种问题,才有了$when...done...fail...then的封装,它将$.ajax这嵌套结构转成了顺序平行的结果,向下面的$.ajax写法,看起来很乱
    $.ajax({
    url: "/home/GetProduct",
    dataType: "JSON",
    type: "GET",
    success: function (data) {
    $.ajax({
    url: "/home/GetProduct",
    dataType: "JSON",
    type: "GET",
    success: function (data) {
    $.ajax({
    url: "/home/GetProduct",
    dataType: "JSON",
    type: "GET",
    success: function (data) {
    }
    }
    }
    而它实现的功能无非就是外层执行完成后,去执行内层的代码代码,看下面的$.when写法,就清晰多了
    $.when($.ajax({
    url: "/home/GetProduct",
    dataType: "JSON",
    type: "GET",
    success: function (data) {
    alert(JSON.stringify(data));
    }
    })).done(function (data) {
    alert(data[0].Name);
    }).done(function (data) {
    alert(data[1].Name);
    }).fail(function () {
    alert("程序出现错误!");
    }).then(function (data) {
    alert("程序执行完成");
    });
    而对于这种ajax的封装,在比较流行的node.js里也需要被看到,这就类似于方法的回调技术!
    在使用MVVM的KO上,更加得心应手,感觉$.when就是为了Knockoutjs而产生的!
    //MVVM数据绑定
    var MyModel = new model();
    $.when($.ajax({
    url: "/home/GetProduct",
    dataType: "JSON",
    type: "GET",
    success: function (data) {
    MyModel.PeopleList = ko.observableArray(data);//先为对象赋值
    }
    })).done(function (data) {
    ko.applyBindings(MyModel);//再绑定对象
    });
    以后我们在进行前端开发时,应该多使用这种顺序的,平行的代码段,而少用嵌套的代码段,这只是大叔个人的见解。
    下面通过一个例子再给大家介绍jquery when then(done) 用法
    //运行条件jquery 1.82以上,直接运行代码,看结果
    var log = function(msg){
    window.console && console.log(msg)
    }
    function asyncThing1(){
    var dfd = $.Deferred();
    setTimeout(function(){
    log('asyncThing1 seems to be done...');
    dfd.resolve('1111');
    },1000);
    return dfd.promise();
    }
    function asyncThing2(){
    var dfd = $.Deferred();
    setTimeout(function(){
    log('asyncThing2 seems to be done...');
    dfd.resolve('222');
    },1500);
    return dfd.promise();
    }
    function asyncThing3(){
    var dfd = $.Deferred();
    setTimeout(function(){
    log('asyncThing3 seems to be done...');
    dfd.resolve('333');
    },2000);
    return dfd.promise();
    }
    /* do it */
    $.when( asyncThing1(), asyncThing2(), asyncThing3() ).done(function(res1, res2, res3){
    log('all done!');
    log(res1 + ', ' + res2 + ', ' + res3);
    })
    以上所述是小编给大家介绍的Jquery $when done then的用法详解,希望对大家有所帮助
随便看

 

在线学习网范文大全提供好词好句、学习总结、工作总结、演讲稿等写作素材及范文模板,是学习及工作的有利工具。

 

Copyright © 2002-2024 cuapp.net All Rights Reserved
更新时间:2025/5/20 20:14:30