首页 > js ajax 函数封装 闭包 回调

js ajax 函数封装 闭包 回调

有这样一个函数:

function getUserInfo(){

     $.ajax({
        type: "POST",
        url: "/user",
        dataType: "json",
        contentType: "application/json;utf-8",
        timeout: 6000,
        error: function () { },
        success: function (data) {  
              console.log(data);      
        }
    });
};

执行这个函数, 希望有个回调,例如: 接上上面的函数写

getUserInfo(data,function(data){
    console.log(data);
})

希望 在 以上代码中 可以获取 getUserInfo 函数的 ajax 查询到的 data 数据

该方法有大神指导一下 该如何写吗


function getUserInfo(data, callback){

     $.ajax({
        type: "POST",
        url: "/user",
        dataType: "json",
        contentType: "application/json;utf-8",
        timeout: 6000,
        error: function () { },
        success: function (data) {  
              console.log(data);
              callback(data);
        }
    });
};


getUserInfo(data, function(data){
    console.log(data);
})

jquery的deferred对象。看下这个 http://www.ruanyifeng.com/blog/2011/08/a_detailed_explanation_of_jquery_deferred_object.html
里面解释的比较详细


为嘛要这么写-。-,这种同步的想法,不对把。按照js的异步的思维,应该是回调function写上后续操作把,如果想写成同步一样的感觉,就必须借助楼上@cely的第三方封装的库


// success callback 
// error callback
function getUserInfo(success, error){

     $.ajax({
        type: "POST",
        url: "/user",
        dataType: "json",
        contentType: "application/json;utf-8",
        timeout: 6000,
        error: error,
        success: success
    });
};

回调

function getUserInfo(data, options) {
    $.ajax({
        type: "POST",
        url: "/user",
        dataType: "json",
        contentType: "application/json;utf-8",
        data: data,
        timeout: 6000,
        error: function () {
            options.fail && options.fail();
        },
        success: function (response) {
            options.success && options.success(response);
        }
    });
}

getUserInfo(data, {
    success: function (response) {
        console.log(response);
    },
    fail: function () {
        //TODO
    }
});

Deferred

function getUserInfo(data) {
    return $.ajax({
        type: "POST",
        url: "/user",
        dataType: "json",
        contentType: "application/json;utf-8",
        data: data,
        timeout: 6000
    });
}

getUserInfo(data)
    .done(function (response) {
        console.log(response);
    })
    .fail(function () {
        //TODO
    });

建议使用第二种方式


===定义的getUserInfo函数,出入你自定义的回调函数====================

function getUserInfo(callback){

     $.ajax({
        type: "POST",
        url: "/user",
        dataType: "json",
        contentType: "application/json;utf-8",
        timeout: 6000,
        error: function () { },
        success: function (data) {  
              //console.log(data);
              callback(data);      
        }
    });
}

===你的调用代码====

getUserInfo(function(userinfoData){
    //处理你的逻辑
})
【热门文章】
【热门文章】