Javascript 用于可恢复性的通用$.ajax（）调用函数

我正在创建一个应用程序，其中我有很多对远程服务器的ajax调用，并广泛使用它们。由于所有调用中的代码几乎相同，我想创建一个可以重用的新函数。在定义“数据”参数的参数结构时，我非常激动。我将在下面解释我的问题

下面提供了我当前的ajax调用示例

当前通话样本：

$.ajax({
    beforeSend: function() {
        $.mobile.loading('show');
    },
    complete: function() {
        $.mobile.loading('hide');
    },
    type: 'GET',
    url: 'http://localhost/test-url/',
    crossDomain: true,
    data: {appkey: '1234567', action: 'action1','name':'me'},
    dataType: 'jsonp',
    contentType: "application/javascript",
    jsonp: 'callback',
    jsonpCallback: 'mycallback',
    async: false,
    error: function() {
        //some operations
    },
    success: function(data) {
        //some operations
    }
});

function newAjax(parm, successCallback, errorCallback) {
    $.ajax({
        beforeSend: function() {
            $.mobile.loading('show');
        },
        complete: function() {
            $.mobile.loading('hide');
        },
        type: 'GET',
        url: 'http://localhost/test-url',
        crossDomain: true,
        data: {appkey: '1234567', parm: parm},
        dataType: 'jsonp',
        contentType: "application/javascript",
        jsonp: 'callback',
        jsonpCallback: 'mycallback',
        async: false,
        success: function() {
            successCallback();
        },
        error: function() {
            errorCallback();
        }
    });
}

我创建的可重用函数：

$.ajax({
    beforeSend: function() {
        $.mobile.loading('show');
    },
    complete: function() {
        $.mobile.loading('hide');
    },
    type: 'GET',
    url: 'http://localhost/test-url/',
    crossDomain: true,
    data: {appkey: '1234567', action: 'action1','name':'me'},
    dataType: 'jsonp',
    contentType: "application/javascript",
    jsonp: 'callback',
    jsonpCallback: 'mycallback',
    async: false,
    error: function() {
        //some operations
    },
    success: function(data) {
        //some operations
    }
});

function newAjax(parm, successCallback, errorCallback) {
    $.ajax({
        beforeSend: function() {
            $.mobile.loading('show');
        },
        complete: function() {
            $.mobile.loading('hide');
        },
        type: 'GET',
        url: 'http://localhost/test-url',
        crossDomain: true,
        data: {appkey: '1234567', parm: parm},
        dataType: 'jsonp',
        contentType: "application/javascript",
        jsonp: 'callback',
        jsonpCallback: 'mycallback',
        async: false,
        success: function() {
            successCallback();
        },
        error: function() {
            errorCallback();
        }
    });
}

问题：

$.ajax({
    beforeSend: function() {
        $.mobile.loading('show');
    },
    complete: function() {
        $.mobile.loading('hide');
    },
    type: 'GET',
    url: 'http://localhost/test-url/',
    crossDomain: true,
    data: {appkey: '1234567', action: 'action1','name':'me'},
    dataType: 'jsonp',
    contentType: "application/javascript",
    jsonp: 'callback',
    jsonpCallback: 'mycallback',
    async: false,
    error: function() {
        //some operations
    },
    success: function(data) {
        //some operations
    }
});

function newAjax(parm, successCallback, errorCallback) {
    $.ajax({
        beforeSend: function() {
            $.mobile.loading('show');
        },
        complete: function() {
            $.mobile.loading('hide');
        },
        type: 'GET',
        url: 'http://localhost/test-url',
        crossDomain: true,
        data: {appkey: '1234567', parm: parm},
        dataType: 'jsonp',
        contentType: "application/javascript",
        jsonp: 'callback',
        jsonpCallback: 'mycallback',
        async: false,
        success: function() {
            successCallback();
        },
        error: function() {
            errorCallback();
        }
    });
}

• 我将通过“parm”参数传递ajax调用的参数。我希望数据值直接添加到父“data”参数中。而不是作为数据的子对象。appKey在所有调用中都保持不变，因此我将它保留在实际函数中

• 我希望success和error回调函数都是可选的。如果未提供，则应忽略它们

可以使用该方法将两个或多个对象组合在一起

data: jQuery.extend({appkey: '1234567'}, parm),

您可以使用

typeof var=='function'

检查是否实际为

successCallback

和

errorCallback

传递了函数

success: function () {
    if (typeof successCallback === 'function') {
        successCallback();
    }
}, 

error: function () {
    if (typeof errorCallback === 'function') {
        errorCallback();
    }
}

。。。虽然如果您只是返回由AJAX请求创建的承诺，并让调用者添加成功、错误处理程序（如果他们愿意的话）可能会更好

function newAjax(parm) {
   return jQuery.ajax({
       /* as before, but without success and error defined */
   });
}

。。。然后：

newAjax().done(function () {
    // Handle done case
}).fail(function () {
    // Handle error case.
});

如果调用方不想添加错误处理程序，他们就不调用

fail（）

---

请注意，

contentType:“application/javascript”，

没有意义（您正在向服务器发送GET参数，而不是javascript…），而且

crossDomain:true，

几乎不需要。另外，由于您正确地使用了回调，因此不需要使用

async:false

。最后，因为您使用的是jsonp，所以前面提到的参数都没有使用。。。为什么要重新发明轮子？看起来你只是把你能想到的所有东西都扔到了请求中，而不了解参数的作用。请求执行跨域调用，所以我添加了这些参数。它使用jsonp，所以我在某个地方读到了使用contentType的内容。。我正在学习所有这些东西。。请原谅我的错误：）