在哪里添加onsubmit到Javascript中的表单

Question

在我的HTML中，我有一个没有onsubmit事件侦听器的表单：

<form action="contact.php" method="post" id="contact">
    ...
    <input type="submit" value="Send" />
</form>

因此，每当我点击"发送"按钮时，表格总是会被张贴出来。但是，我想首先验证输入，所以我想附加一个事件侦听器并截取post。这就是我将事件侦听器附加到表单的方式：

window.onload = function() {
    function validate() {
        return window.confirm("Confirm");
    }
    var form = document.getElementById("contact");
    form.addEventListener("submit", validate);
}

当事件监听器被执行时，如果我采用上述方法，表单总是发布！但是，如果我将validate()函数设置为全局函数，并在<form>标记中使用onsubmit="return validate();"，那么表单将仅按预期有条件提交。

为什么添加如上所述的validate()函数不起作用？false返回值似乎丢失了？

Answer 1

现代事件处理有一个更复杂的API，它提供了更多的灵活性，但这是以无法将行为与简单的布尔结果联系起来为代价的。

对于您的用例，您需要捕获事件对象：

function validate(ev) {

然后你可以阻止它的默认操作：

if (!confirm('Confirm')) {
    ev.preventDefault();
}