<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>作业1</title> <link rel="stylesheet" type="text/css" href="bootstrap.min.css"> <style> .container { margin-top: 50px; } </style> </head> <body> <div class="container"> <div class="row"> <div class="col-md-4 col-md-offset-4"> <form action="#" novalidate> <div class="form-group"> <label for="username">用户名</label> <input type="text" class="form-control" id="username" placeholder="username"> <span id="helpBlock" class="help-block"></span> </div> <div class="form-group"> <label for="Password">密码</label> <input type="password" class="form-control" id="Password" placeholder="Password"> <span id="helpBlock2" class="help-block"></span> </div> <button type="submit" class="btn btn-default submit">提交</button> </form> </div> </div> </div> <script src="jquery.min.js"></script> <script src="bootstrap.js"></script> <script> $(".submit").on("click",function () { $("form .form-group").removeClass("has-error"); $("form span").text(""); $(":input").each(function () { if ($(this).val().length===0){ console.log($(this).next().html()) console.log($(this).prev()[0].innerHTML) var name = $(this).prev().text(); $(this).parent().addClass("has-error"); $(this).next().text(name+"不能为空"); return false } }); return false }) </script> </body> </html>