Question

可能重复：
How to know which element in body triggered AJAX request in jQuery

是否有可能从jquery全局处理程序获取触发ajax调用的元素，即。 $（document）.ajaxSend和$（document）.ajaxComplete事件？所以我可以处理这两个位置的禁用/启用按钮。我目前只是从按钮的onclick事件中禁用正在执行调用的按钮，然后在调用完成时重新启用它。

但是我越来越懒，想找一个更“优雅”的方法。我可以从FF中的ajaxSend看到event.target.activeElement但在Chrome中它不起作用。

更新：我基本上只想从2个位置进行操作，而且每次我想让按钮正确处理ajax调用时都不需要添加额外的代码。

Answer 1

只有事件处理函数从提供给它的第一个参数中知道哪个事件和元素触发了它。

如果该处理程序随后启动了一个AJAX调用，那么知道该调用发生原因的唯一方法就是自己传递事件和元素信息。

根据您的用例，禁用按钮然后再次重新启用它的代码不是那么艰难：

$('#button').on('click', function() {
   var self = this;

   self.disabled = true;
   $.ajax(...)
    .done(function() {
       self.disabled = false;
   }
});

如果需要，很容易重构。

Answer 2

最接近的是在进行ajax调用时设置上下文

$.ajax({
    context: this,
});

其中$（this）实际上是按钮点击事件中的按钮，其中进行了ajax调用，然后通过ajaxSend和ajaxComplete的设置访问此上下文

$(document).ajaxSend(function (event, request, settings) {
     if (settings.context != undefined &&
        settings.context.length && 
        settings.context[0].nodeType) {
        $(settings.context).attr("disabled", true);
     }
 });

包装器将是

$.fn.extend({
        post: function (url, data, callback, type) {
            if (jQuery.isFunction(data)) {
                type = type || callback;
                callback = data;
                data = undefined;
            }

            return jQuery.ajax({
                type: 'post',
                url: url,
                data: data,
                success: callback,
                dataType: type,
                context: this.length == 0? undefined:this
            });
        }
    });

现在我可以调用$（button）.post（url，callback）。不应该太难以替换所有现有的电话。：）

获取从全局jquery处理程序触发ajax调用的元素

2 个答案: