阮一峯關於deferred 詳解

關於jquery中ajax請求的深入瞭解,deferred可能是jquery中1.5版本以後最重要的方法,你真的理解了嗎!

http://www.ruanyifeng.com/blog/2011/08/a_detailed_explanation_of_jquery_deferred_object.html


自己試着封裝的ajax

直接上馬:

html:

 <button id="btn" οnclick="ajaxBtn(this)"></button>
js代碼:

/*
    * @obj 事件對象
    * @url必填
    * @data,type,async beforeSend有默認值
    * @beforeSend ajax發送之前的狀態事件;
    * @ajax 形成promise對象 
    * @then 成功與失敗的函數
    * */
    jQuery.extend({
        ajaxCode:function (url,data,type,async) {
            var dtd = $.Deferred();
           $.ajax({
                url:url,
                data:data || {},
                type: type || 'GET',
                cache: 'false',
               dataType:dataType || 'json',
                async:async || 'true',
                success: dtd.resolve,
                error: dtd.reject,
            });
            return dtd.promise();
        },
        ajaxCode2:function (url,data,type,async) {
            var dtd = $.Deferred();
           $.ajax({
                url:url,
                data:data || {},
                type: type || 'GET',
                cache: 'false',
               dataType:dataType || 'json',
                async:async || 'true'
            }).then(function(data){
                 dtd.resolve(data);
            }, function(){
                 toastr.error("提交失敗", "操作失敗");
                 dtd.reject();
            });


            return dtd.promise();
        },
    });





    function ajaxBtn (obj) {
        var  obj =  arguments[0] ;
        $.ajaxCode(obj,url,data,type,async,beforeSend).then(function(data){},function(data){})
    };


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章