首页 > 解决方案 > 如何在 $.ajax 调用中使用变量调用成功函数

问题描述

在 Javascript 中,我将如何进行这样的工作:

function callAjax (url, successCallback, errorCallback)
{
  var ajaxProps = {
    url: url,
    success: successCallback,
    error: errorCallback
  }
  return $.ajax(ajaxProps);
}

无论我如何尝试,我都会不断收到错误或者它们是未定义的。我正试图慢慢地从一个上帝对象中解脱出来。因此,通常 ajax 调用将针对 parent.specificSuccess,因为它来自该对象。我也尝试过使用 godObject[successCallback] 和 global[namespace].godObject[successCallback]。我还尝试了所有这三种变体:

function callAjax (url, successCallback, errorCallback)
{
  var ajaxProps = {
    url: url,
    success: function (response) {
      successCallback(response);
    },
    error: function (response) {
      errorCallback(response);
    }
  }
  return $.ajax(ajaxProps);
}

它是从上帝对象内部调用的:

callAjax('https://url.com', specificSuccess, specificError);

我已经尝试了上面列出的所有三个选项,并且在它前面也使用了“父级”。

我知道我一定错过了一些东西,我以前从未遇到过被要求做这样的事情的实例。似乎我应该能够使用带有方法名称的变量在回调中调用方法......但谷歌在这方面让我失望了。

标签: javascriptjqueryajaxobject

解决方案


我有一个例子。它非常适合我。您可以将此代码保存为 .js 文件并在您的网页中引用。您可以像这样调用 ajax 方法: backend.ajax.AjaxPOST() 传递参数。可选地,你可以有一个加载。

backend.ajax = {

AjaxPOST: function (url, data, dataType, callBackSucess, callBackError, loadig) {
    $.ajax({
        type: "POST",
        url: url,
        data: data,
        dataType: dataType,
        success: function (e) {
            if (callBackSucess != null)
                callBackSucess(e);
        },
        beforeSend: function (e) {
            if (loadig == true)
                startLoadingAjax();
        },
        complete: function (e) {
            if (loadig == true)
                endLoadingAjax();
        }
    });
},

AjaxGET: function (url, dataType, callBackSucess, callBackError, loadig) {
    $.ajax({
        type: "GET",
        url: url,
        dataType: dataType,
        success: function (e) {
            if (callBackSucess != null)
                callBackSucess(e);
        },
        error: function (e) {
            if (callBackError != null)
                callBackError(e);
        },
        beforeSend: function (e) {
            if (loadig == true)
                startLoadingAjax();
        },
        complete: function (e) {
            if (loadig == true)
                endLoadingAjax();
        }
    });
}};


var divLoading = "<div id=\"Loading\" style=\"display: none; position: fixed; z-index: 1000; top: 0;left: 0; height: 100%;width: 100%;background: rgba( 255, 255, 255, .8 ) url('http://i.stack.imgur.com/FhHRx.gif') 50% 50% no-repeat;display:block;\"></div>";

function startLoadingAjax() {
$("body").append(divLoading);}

function endLoadingAjax() {
$("#Loading").remove();}

推荐阅读