2015-06-25 112 views
0

我開發了一個Chrome擴展,需要在某些情況下攔截所有表單提交。Chrome內容腳本:獲取jQuery委託事件處理程序

擴展使用原始JavaScript,沒有jQuery,,我真的想通過包含jQuery來避免它膨脹,因爲它大部分已經實現了,因爲它是一個Chrome擴展,所以跨瀏覽器支持不是必要的:)

這適用於我測試了擴展的大多數網站,除了一個特別使用jQuery的delegate函數來綁定提交事件,然後使用jQuery的.trigger方法來實際觸發表單提交時點擊提交按鈕。

我已經把一個JSBin是複製問題:http://jsbin.com/cuxowo/edit?html,js,output

  • jQuery的綁定設置了.delegate
  • jQuery的委託click事件處理程序「提交表單」按鈕來調用一個方法.trigger("submit"在父窗體上
  • 類似於初始化我的分機的方法綁定到「激活擴展」按鈕的處理器

步驟來複制

  • 負荷JSBin
  • 點擊 「提交表單」 按鈕
  • 看到只有處理程序中設置的jQuery觸發
  • 點擊「激活擴展「設置addEventListener處理程序
  • 再次單擊」提交表單「按鈕
  • 請參閱這,同樣,只有處理程序中設置的jQuery被觸發(注意:這是我想被觸發我addEventListener處理)
  • 刪除了jQuery委託給click事件「提交表單」按鈕(刪除了代碼段和重裝JSBin正常工作)
  • 激活擴展,然後點擊「提交表單」再次
  • 注意,當jQuery的委託click事件不到位,addEventListener處理器作品!

好像jQuery的授權使用.trigger("submit"實際上並不觸發submit處理程序通過addEventListener設立click處理程序 - 它似乎像jQuery只有觸發事件處理其成立本身。

如何確保我的擴展的表單提交事件處理程序即使在這樣的頁面上被觸發?

回答

0

我設法猴補丁在我的分機的內容腳本初始化jQuery的$.event.trigger方法來完成我需要在這種情況下什麼:

// hijack jQuery event handlers if present 
if ($ !== undefined && $.event !== undefined && $.event.trigger !== undefined) { 
    var orig_handler = $.event.trigger; 
    var new_handler = function(event, data, elem) { 
    var type = event.type || event; 
    var eventObj = new Event(type); 

    elem.dispatchEvent(eventObj); 

    return orig_handler.apply(event, arguments); 
    }; 

    $.event.trigger = new_handler; 
} 
相關問題