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

Question

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

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

因此，每当我单击“发送”按钮时，表单总是会被发布。但是，我想先验证输入，所以我想附加一个事件侦听器并拦截帖子。这就是我将事件侦听器附加到表单的方式：

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();
}