jQuery 事件提交未在用户操作时触发

Question

我正在尝试将通用表单 onsubmit 事件侦听器添加到宽网站，但我无法将特定事件侦听器添加到每个页面和单个页面。

页面中的所有 "form" 个元素都应该触发该事件。

到目前为止我尝试过的是：

$(function() {
    $("form").submit(function(event) {
        alert("submit");
    });
});

示例页面 dom:

<form method="post">
  <input type="text" name="afield" />
  <button>
  submit!
  </button>
</form>

但是事件没有触发，你知道我做错了什么吗？我无法编辑表单 html 代码，或创建针对特定表单的事件处理程序（例如通过 name/id）。

谢谢！

Answer 1

您的表单正在提交，因为您需要event.preventDefault()默认浏览器提交。

首先确保您已将代码包装在 DOM 准备好并且
使用带有事件委托的 .on() 方法。
使用 Event.preventDefault

jQuery(function( $ ){ // DOM is now ready and $ alias secured

    $(document).on("submit", "form", function(event) { // Future and existent form Elements
        event.preventDefault(); // prevent browser to default submit
        alert("submit");        // do anything you like
    });

});

https://api.jquery.com/ready/
http://api.jquery.com/on/
http://learn.jquery.com/using-jquery-core/document-ready/
https://developer.mozilla.org/en/docs/Web/API/Event/preventDefault

此外，请确保您在结束 </body> 标签之前包含了 jQuery 库和 <script> 标签（最好）。

Answer 2

你的表格好像是后来出现的，一开始就不存在。

$(function() {
    $("body").on('submit', "form", function(event) {
        alert("submit");
    });
});

Answer 3

在脚本前添加*一个 jQuery 库：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
    $(function() {
        $("form").submit(function(event) {
           alert("submit");
        });
    });
</script>

_{*: 我好像不见了。始终关注控制台的错误。}

jQuery 事件提交未在用户操作时触发

jQuery event submit not firing on user action

javascript

jquery

jquery-events