jq deferred举例

1.当两个ajax都执行完执行某函数

var getJson={
            getData:function(data){
                var defer = $.Deferred();
                var result;
                $.ajax({
                    url:'http://datainfo.duapp.com/shopdata/getGoods.php',
                    dataType:'jsonp',
                    async:false,
                    success:function(data){
                        var html="";
                        // $.each(data,function(i) {
                        //     html+="<div class='flex list'><img class='pic' src='"+data[i].goodsListImg+"'/><div class='name'>"+data[i].className+"</div><div class='num'>"+data[i].goodsID+"</div><img class='badge' src='img/list-1.jpg' /></div>"
                        // });
                        // $(".container").append(html);
                        // result=true; 
                        result=data[0].className;
                        console.log(result);
                        defer.resolve(result);      
                    },
                    error:function (XMLHttpRequest, textStatus, errorThrown){   
                       alert(XMLHttpRequest);   
                    } 
                })
                return defer.promise();                
            },
            getSome:function(res){
                var defer = $.Deferred();
                var result=false;
                $.ajax({
                    url:'http://datainfo.duapp.com/shopdata/getGoods.php',
                    dataType:'jsonp',
                    async:true,
                    success:function(data){
                        // var html="";
                        // $.each(data,function(i) {
                        //     html+="<div class='flex list'><img class='pic' src='"+data[i].goodsListImg+"'/><div class='name'>"+data[i].className+"</div><div class='num'>"+data[i].goodsID+"</div><img class='badge' src='img/list-1.jpg' /></div>"
                        // });
                        // $(".container").append(html);
                        // result=true; 
                        // console.log(result); 
                        result=data[8].className;
                        console.log(result);
                        defer.resolve(result);       
                    },
                    error:function (XMLHttpRequest, textStatus, errorThrown){   
                       alert(XMLHttpRequest);   
                    } 
                })
         
                return defer.promise(); 
            }         
        } 
        $.when(getJson.getData(),getJson.getSome()).done(function(res1,res2){   
                setTimeout(function(){
                    console.log(res1+" "+res2);
                },1000);        

        })

2.当执行完1个异步函数后延迟执行另一个函数

  var getJson={
            getData:function(data){
                var defer = $.Deferred();
                var result;
                $.ajax({
                    url:'http://datainfo.duapp.com/shopdata/getGoods.php',
                    dataType:'jsonp',
                    async:false,
                    success:function(data){
                        var html="";
                        $.each(data,function(i) {
                            html+="<div class='flex list'><img class='pic' src='"+data[i].goodsListImg+"'/><div class='name'>"+data[i].className+"</div><div class='num'>"+data[i].goodsID+"</div><img class='badge' src='img/list-1.jpg' /></div>"
                        });
                        $(".container").append(html);
                        result=true; 
                        result=data[0].className;
                        //console.log(result);
                        defer.resolve(result);      
                    },
                    error:function (XMLHttpRequest, textStatus, errorThrown){   
                       alert(XMLHttpRequest);   
                    } 
                })
                return defer.promise();                
            },
            getSome:function(res){
                $.when(getJson.getData()).done(function(res1){ 
                    console.log(res1);
                    setTimeout(function(){
                        $(".top").css("color","#ca2")
                    },1000);  
                })
                
            }         
        } 
        // $.when(getJson.getData(),getJson.getSome()).done(function(res1,res2){   
        //         setTimeout(function(){
        //             console.log(res1+" "+res2);
        //         },1000);        

        // })
        $("#btn").click(function(){
            getJson.getSome();
        })

  

 

posted @ 2017-02-14 10:19  李元夕cool  阅读(128)  评论(0编辑  收藏  举报