如果表单未被验证，则停止提交

本文关键字：提交 验证 表单 如果 | 更新日期: 2023-09-27 18:18:20

我有一个表单，我有一个"取消"和提交按钮。当用户提交表单时，如果必需的字段没有填写，我想要发出警告("error")并停止要提交的表单。

这是我的简单的jquery代码，但当用户点击ok按钮的警告框，它继续提交。

<script>
$(document).ready(function () {
    $('#<%=btn_reddet.ClientID %>').click(function (event) {
        alert("Error!");
        event.preventDefault();
    });
});
</script>

如何使它在警报后停止提交?

如果表单未被验证，则停止提交

可以用.submit代替.click，只需要返回false来停止表单提交

$('#formID').on('submit',function (event) {
        alert("Error!");
        return false;
});

使用$('form').submit()事件代替$('submit_button').click()事件。如果验证失败，则return false:

$(document).on('submit','form',function(e) {
    var validated = true; 
    // some validation code which sets 'validated = false' if it fails
    return validated;
});

如果你想使用

event.preventDefault();

那么我认为还需要后面跟着

event.stopPropagation();

event.preventDefault()和return false不一样，当出现问题(read: error)和event.preventDefault()是否已经执行时存在差异，这里有一个例子说明什么时候重要以及为什么return false不总是工作:

$('a').click( function(e){
    $(this).css("background", "green");
    err();  // err is not defined, so JavaScript will throw error, and the browser will ignore rest of the code (return false;). The browser will perform the default action.
    return false;
});
$('a').click( function(e){
    e.preventDefault();
    $(this).css("background", "green");
    err();  // err is not defined, so JavaScript will throw error, and the browser will ignore rest of the code. We already called event.preventDefault() so the browser will not perform default action.
});
相关文章：