如果验证失败，如何停止表单提交

How to stop Form submit if the validation fails

本文关键字：何停止 表单提交 验证 失败 如果      更新时间：2023-09-26

更新：我的问题更多的是关于How to prevent the form submit if the validation fails

该链接无法解决我的问题

只是重申我正在做的事情：我有一个带有一堆输入字段的表单，当用户点击提交按钮时，它使用属性required="required"验证表单，如果表单验证失败，那么我想停止提交表单，因为您看到 javascript 它在用户提交表单时显示div。

希望这能解决。

结束更新

如果表单验证失败，如何停止表单提交触发？

<input class="form-control" data-val="true" id="SerialNumber" name="SerialNumber" required="required" type="text">
<button type="submit" name="rsubmit" class="btn btn-success">Submit</button>
 //loading message:
 $("form").submit(function (e) {
     $("#loading").show();
 });

如果验证失败，你需要做两件事，例如 preventDefault（） 和返回 false。

对于您的示例，使用给定的输入，伪代码可能是下一个：

$("form").submit(function (e) {
   var validationFailed = false;
   // do your validation here ...
   if (validationFailed) {
      e.preventDefault();
      return false;
   }
});

我能够解决问题：

首先在您的页面上添加引用：

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.validate.unobtrusive.min.js"></script>

然后执行此检查：

        $("form").submit(function () {
            if ($(this).valid()) {  //<<< I was missing this check
                $("#loading").show();
            }
        });

像这样在表单的提交处理程序上编写验证代码 

<form onsubmit="return Validation()">
    <input class="form-control" data-val="true" id="SerialNumber" name="SerialNumber" required="required" type="text">
    <button type="submit" name="rsubmit" class="btn btn-success">Submit</button>
    <script>
        function Validation(){
        //Do all your validation here
        //Return true if validation is successful, false if not successful
        //It will not submit in case of false.
        return true or false;
        }
    </script>
</form>
相关文章：