Javascript 在表单中添加eventListener以提交按钮

我有一个带有提交按钮的表单，可以将表单数据发送到下一页。到现在为止，一直都还不错。但是现在，当用户提交表单时，应该会执行一些javascript代码（出于跟踪原因）。所以我尝试设置一个事件侦听器。问题是：有时代码会执行，有时会被忽略

我设置了一个超时，并计算出所有超过15毫秒的超时都不会执行代码，并且“到浏览器”已经在form_test.html页面上

//secTimeout=15；
按钮=document.getElementById（'submitbutton'）；
addEventListener（“单击”，函数（）{
//setTimeout（函数（）{
//log（“+secTimeout+'ms'之后的日志”）；
//}，secTimeout）；
//执行跟踪工具
});

简单的答案是


您应该在事件处理函数中接收事件参数
然后您应该防止此事件的默认值（因为通常在
您按下提交按钮，它将提交表单）
然后你应该做你的追踪代码
然后，您应通过以下方式手动提交表格：
调用表单的提交方法
添加跟踪功能的最佳方法是处理提交程序。所以，用一个简单的方法，从中获得灵感。通过发送表单programmaticaly，您可以在发送之前运行所需的任何代码

一个小例子：

<form id="form1" action="form_test.html">
  <input type="text" name="text1">
  <input type="text" name="text2">
  <input type="text" name="text3">
  <button id="submitbutton">
</form>


button = document.getElementById('submitbutton');
button.addEventListener("click", function() {
  // execute tracking tool
  document.form1.submit();
});


按钮=document.getElementById（'submitbutton'）；
addEventListener（“单击”，函数（）{
//执行跟踪工具
文件。表格1。提交（）；
});
不要设置超时，直接运行代码即可。或者您可以将代码附加到表单的提交功能，防止提交事件出现默认值，然后在完成代码后触发手动提交？但是，一般来说，如果只有在表单提交后才需要等待一段时间，请运行代码，然后期望表单正常提交，那么您可能设计的代码流是错误的。更好的方法是从表单中删除submit按钮，然后使用普通按钮。或者，您可以尝试使用preventDefault：谢谢，最后我使用了一个按钮，而不是InputType=submit