需求:

用户提交表单的时候,对表单的内容进行验证

如果提交的时候,表单内容为空

则提示错误,阻止提交

否则,才正常的进行提交

》正文,随堂演示

  • 解决阻止表单提交的问题
return false

表单的提交主要是通过 表单对象的submit方法实现的

如果这个方法return false

那么表单就不会发起提交行为

另附上以前的学习笔记:

也可以通过事件对象的方法来阻止事件的默认行为
jquery-表单验证_提交表单

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="jquery-1.12.4.min.js"></script>
</head>
<body>

<form action="">
    * 姓名:<input type="text" name="name">
    * 密码:<input type="text" name="pwd">
    地址: <input type="text" name="addr">
    <input type="submit">
</form>

<script>
    // 获取表单标签对象
    var $fm = $("form");
    // 设置阻止提交

    $fm.submit(function () {
        // 判断指定的表单控件的值,如果值为空,那么就阻止提交
        return false
    })
    
</script>
</body>
</html>
  • 详细代码,待解决