jQuery ajaxComplete：有没有办法判断哪个 Javascript 函数执行了 ajax 调用？答案

【问题标题】：jQuery ajaxComplete: Is there a way to tell which Javascript function executed the ajax call?jQuery ajaxComplete：有没有办法判断哪个 Javascript 函数执行了 ajax 调用？
【发布时间】：2012-10-19 14:13:01
【问题描述】：

我将 .ajaxComplete 事件连接到如下几个元素：

$("#ElementId").ajaxComplete(function (a, b, c) { });

问题是我的脚本中有多个 $.ajax 调用，这些调用由各种函数调用。我不希望为每个 ajax 调用的每个控件触发 .ajaxComplete 事件。从概念上讲，我正在寻找这样的东西：

if (a.function == SearchCustomers) { do this }

有什么方法可以在这里实现我想要的吗？

编辑：我意识到我可以检查我正在调用的服务的 URL，但我不想在我的脚本中多次硬编码 URL 字符串。

【问题讨论】：

是的，不要使用.ajaxComplete global，而是为每个调用附加一个完整的函数。
...或者更确切地说是 $.ajax 中的 success 而不是 complete。一致的命名太容易了！
您的情况很简单，success 属性显然是您应该使用的，但如果您遇到需要 ajaxComplete 完全按照您在问题中陈述的方式行事的情况，看看我发布的内容。

标签： jquery ajax

【解决方案1】：

更新

查看此演示：http://jsfiddle.net/Z6Z5e/4/

您可以在 .ajax() 调用中的自定义属性中指定函数标识符，并在 ajaxComplete() 回调中使用该值。

例如，在调用.ajax() 时添加'func' 属性：

function foo() {
    $.ajax({
        url: '/someurl',
        ...
        func: 'foo',
        ...
    });
}

然后，使用 ajaxComplete() 中的值

$('#someElement').ajaxComplete(function(e, xhr, settings) {
    if (settings.func == 'foo') {
        // ... 
    }
    else if (settings.func == 'bar') {
        // ...
    }
});

【讨论】：

谢谢，你拯救了我的一天！您可以只记录“设置”以查看是否有更准确的数据可以构建您的“如果”。

【解决方案2】：

你必须这样做：

$.ajax({
    url: "servicecall.html",
    success: function(html){
        //if success
    };
});

【讨论】：

我的大脑被炸了。我已经在使用success，而且somwehow 没想到在我成功使用的函数的末尾调用我的其他函数。谢谢！

【解决方案3】：

我个人喜欢将我的模块组织在 JS 对象中，而不是出于各种原因将我的 Ajax 调用抽象为函数：

var YourModule = {
    Ajax: {        
        AjaxCallOne: function()
        {
            return $.ajax({
                // your options for the call    
            }).promise();
        },
        AjaxCallTwo: function()
        {
            return $.ajax({
                // your options for the call    
            }).promise();
        }
    },
    Events: {
        OnButtonOneClick: function()
        {
            YourModule.Ajax.AjaxCallOne().then(YourModule.Events.OnAjaxCallOneReceived);
        },
        OnButtonOneClick: function()
        {
            YourModule.Ajax.AjaxCallTwo().then(YourModule.Events.OnAjaxCallTwoReceived);
        },
        OnAjaxCallOneReceived:function(data)
        {
            // your code            
        },
        OnAjaxCallTwoReceived: function(data)
        {
            // your code    
        }
    }            
};

.then() 正在工作，因为 $.ajax 实现了延迟的“接口”。请参阅此参考： http://api.jquery.com/category/deferred-object/

另外，考虑让代码用户能够更改传递给 $.ajax 调用的选项。为此，我使用 $.extend。请参阅此参考： http://api.jquery.com/jQuery.extend/

【讨论】：

【解决方案4】：

Ajax 调用一：

$.ajax({
    // set all your properties as needed
    url: myUrl,
    success: function(data) {
        // handle the result from THIS .ajax call
    }
});

Ajax 调用二：

$.ajax({
    // set all your properties as needed
    url: myotherURL,
    success: function(data) {
        // handle the result from THIS .ajax call
    }
});

如果你有很多 .ajax 调用需要做同样的事情，那么你可以使用 $.ajaxSetup 来设置一个默认的成功函数

【讨论】：