2012-03-14 67 views
0
觸發Ajax調用越來越元

可能重複:
How to know which element in body triggered AJAX request in jQuery從全球jQuery的處理程序

是否有可能得到觸發從jQuery的全球處理器,即Ajax調用的元素。 $(document).ajaxSend和$(document).ajaxComplete事件?所以我只能從這兩個位置處理禁用/啓用按鈕。我目前只是禁用正在執行該按鈕的onclick事件調用的按鈕,然後在調用完成時將其重新啓用。

但我越來越懶,想找一個更「優雅」的方法。我可以從FF中的ajaxSend中看到event.target.activeElement,但在Chrome中它不起作用。

更新:我基本上只想從2個位置做到這一點,而不是每次我想讓按鈕正確處理ajax調用時添加額外的代碼。

+0

@Matt應該取消刪除他的答案 - 這是正確的! – Alnitak 2012-03-14 16:26:28

+0

還有什麼其他答案? – sean 2012-03-14 16:31:10

+0

啊,你不能看到它,因爲你的代表太低。 – Alnitak 2012-03-14 16:33:36

回答

0

只有事件處理程序函數根據提供給它的第一個參數知道哪個事件和元素觸發了它。

如果該處理程序隨後啓動了AJAX調用,那麼要知道爲什麼會發生此調用的唯一方法是自行傳遞事件和元素信息。

考慮您的使用情況下,代碼禁用按鈕,然後重新啓用它再也不艱鉅:

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

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

,這將是易於重構,如果需要的。

+0

嗯,FF下的event.target.activeElement在$(document).ajaxSend()中實際上指向觸發該調用的元素,但不包含指向body的IE和Chrome – sean 2012-03-14 16:51:58

0

最近我得到的是設置上下文進行Ajax調用

$.ajax({ 
    context: 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)。不應太難替換所有現有的電話。 :)