表单的事件监听器在javascript中提交,没有提交动作

时间:2017-03-23 19:30:39

标签: javascript jquery html forms google-chrome-extension

我一直在构建chrome扩展,我一直在使用内容脚本来监听表单提交事件。我正在测试我的扩展,它运行得很好,直到我在一个没有工作的网站上测试。它没有工作的原因是因为表单按钮实际上不是带有提交操作的表单按钮。它实际上是一个带有href标记的<a>标记,链接到&#34; javascript:;&#34;,因此提交事件不会触发。该链接位于表单内,它不是带有提交操作的按钮标记。如何在用户尝试提交表单时确保我的内容脚本会触发?

1 个答案:

答案 0 :(得分:1)

一目了然似乎很简单,但是没有万无一失的方法来实现你所要求的。

考虑一下:

&#13;
&#13;
document.getElementById('myform').addEventListener('submit', function(e) {
  e.preventDefault();
  console.log(document.getElementById('sometext').value);
  console.log('form submitted');
});

document.getElementById('notasubmitbutton').addEventListener('click', function(e) {
  console.log(document.getElementById('sometext').value);
});
&#13;
<form id="myform">
  <input type="text" id="sometext">
  <input type="submit">
  <button id="notasubmitbutton" type="button">Submit 2</button>
</form>
&#13;
&#13;
&#13;

会有触发提交事件的常规提交按钮。然后是另一个按钮,它只收集表单中的所有数据,但不会按照传统意义提交。

你绝对没有办法预见到某人可以建立自己形式的所有方式,所以你所要求的就无法完成。