如何優化（最小化）jQuery AJAX調用

Question

我有來自我的代碼的不同功能的50多個AJAX調用。 所有這些調用都有類似的結構，具有不同的data / url / callback參數：

var jqXHR = $.post('/dba/port.php', {
        mode: "del_wallfunds",
        pdata: cdata,
        wname: wName
    },
    function (data) {}, "json")
    .done(function (data) {
        var msg = data.msg;
        if (msg.indexOf("Error") == -1) {
            alertify.success(msg);
            delSelected(selGroup);
        } else {
            alertify.error(msg);
        }
    })
    .fail(function () {
        alertify.error("Error .....");
    });

我在想如何編寫一個函數來返回var jqXHR以最小化代碼的總大小。 傳遞所有靜態變量（如URL，錯誤字符串等） 不是問題 。 但問題是“.done”上的所有回調函數都不同 ，我不知道如何將這些回調函數作為變量傳遞。

一種方法是在.done上調用單個“通用”函數並將“switch”變量傳遞給該函數，但它似乎不是一個優雅的解決方案。

有什么建議如何以優雅的方式？

謝謝

Answer 1

在調用函數時將done回調函數作為參數傳遞：

function ajaxCall(url, data, doneCallback) {
    return $.post(url, data, doneCallback, "json").fail(...);
    // or
    return $.post(url, data, function() {}, "json").done(doneCallback).fail(...);
}

var jqXhr = ajaxCall('yoururl.php', {key: 'value'}, function(data) {
    // do something
});

或者從函數返回jqXhr對象，然后分配done回調：

function ajaxCall(url, data) {
    return $.post(url, data, function() {}, "json").fail(...);
}

var jqXhr = ajaxCall('yoururl.php', {key: 'value'});
jqXhr.done(function(data) {
    // do something
});

或者切換到使用jQuery.ajax() ，並傳遞整個選項對象：

function ajaxCall(options) {
    return $.ajax(options).fail(...);
}

var jqXhr = ajaxCall({
    url: 'yoururl.php',
    data: {key: 'value'},
    dataType: 'json'
});
jqXhr.done(function(data) {
    // do something
});

Answer 2

您可以嘗試：

• 將“請求成功返回處理錯誤”轉變為“拒絕請求”，
• 將“alertify”處理放在一個共同的回調中

這是一個草圖，它可以給出：

function myAjaxApi(url, data){
    var myAjaxCall = $.post(url, data, function (data) {}, "json")
    .then(function (data) {
    // using .then : change "request succesful with error state"
    //    to "rejected state"
        var msg = data.msg;
        if (msg !== undefined && msg.indexOf("Error") >= 0) {
            var dfd = $.Deferred();
        // try to match the same signature as the "error" option
            dfd.reject(this, msg);
            return dfd;
        } else {
            return data
        }
    });

    myAjaxCall.done(function(data){
        if (data.msg) {
            alertify.success(data.msg);
        }
    }).fail(function (jqxhr, msg) {
        if (!msg) {  msg = "Error .....";  }
        alertify.error(msg);
    });
    return myAjaxCall;
}

//usage
myAjaxApi('/dba/port.php', {mode: "del_wallfunds", pdata: cdata, wname: wName})
.done(function (data) {
// the ".done()" queue will not be executed if msg contains "Error" ...
    delSelected(selGroup);
});

有些部分應該寫得更加謹慎; 以上示例旨在說明如何將重復的ajax調用包裝在公共API中。