攔截Chrome內容擴展中的表單提交

Question

我想攔截特定網站上表單的提交。表格沒有ID，但它有一個名字。我不想使用jQuery，因爲我的擴展非常輕，並且沒有依賴關係。表單不是由按鈕提交的，而是由submit（）方法提交的。

我想我可以只處理onSubmit事件，但它似乎並沒有得到提高。

現在我很難過，有什麼想法嗎？

Answer 1

您可以

var myForm = document.getElementsByName('myForm');

它返回一個nodeList（類似於Array）趕上你的表格。然後，你可以通過兩種方式覆蓋submit事件：

myForm.onsubmit = function (evt) {...};

或

myForm.addEventListener('submit', function (evt) {...});

注意只使用小寫字母的事件名稱。通過第二個示例，您可以將多個偵聽器綁定到該事件，但舊版瀏覽器不支持（< IE 9）。

例子：

HTML：

<form name="myForm" action="#" method="post"> 
    <input type="submit" value="Send"> 
</form> 

JS：

var myForm; 

myForm = document.getElementsByName('myForm')[0]; 

myForm.onsubmit = function (evt) { 
    // Do things here before passing on or stop the submit 
}; 

Answer 2

在我content.html：

var patch = document.createElement('script'); 
patch.src= chrome.extension.getURL('patch.js') 
document.body.appendChild(patch); 

document.forms['logoutForm'].onsubmit = function() { 
     chrome.extension.sendRequest({logout: true}); 
} 

在補丁.js文件：

document.logoutForm.submitOrig = document.logoutForm.submit; 

document.logoutForm.submit = function() { 

    this.onsubmit(); 

    this.submitOrig(); 

};