拦截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(); 

};