除了 HTML 属性之外，如何在 Javascript 中监听表单提交事件？

在 Javascript 中监听表单提交事件：超越 HTML 属性

检测 Javascript 中表单的提交对于验证用户输入和验证表单至关重要控制表单行为。虽然使用 onClick 和 onSubmit 等 HTML 属性就足够了，但它限制了自定义和灵活性。本文探讨了使用纯 Javascript 和通用库监听表单提交事件的替代方法。

纯 Javascript 方法

要将事件监听器附加到表单元素，请使用 addEventListener或基于浏览器支持的attachEvent：

<code class="javascript">var ele = /*Your Form Element*/;
if (ele.addEventListener) {
  ele.addEventListener("submit", callback, false); // Modern browsers
} else if (ele.attachEvent) {
  ele.attachEvent("onsubmit", callback); // Old IE
}</code>

要取消本机提交事件，请在回调函数中使用preventDefault()：

<code class="javascript">document.querySelector("#myForm").addEventListener("submit", function (e) {
  if (!isValid) {
    e.preventDefault(); // Stop form from submitting
  }
});</code>

库方法

如果首选使用库（例如 jQuery）：

• jQuery：

<code class="javascript">$(ele).submit(callback);</code>

Cross -浏览器兼容性

虽然 addEventListener 方法得到广泛支持，但较旧的浏览器可能需要 AttachEvent。为了确保跨浏览器兼容性，如有必要，请同时使用这两种方法。

以上是除了 HTML 属性之外，如何在 Javascript 中监听表单提交事件？的详细内容。更多信息请关注PHP中文网其他相关文章！