重点：
1、表单的提交
2、触发blur事件
3、判断是否正确，提交与否 return False
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body> <form action="http://localhost/reg">
<p>
用户名：
</p>
<p>
<input type="text" name="username" id="username" >
<span id="username_error"></span>
</p>
<p>
密码：
</p>
<p>
<input type="text" name="pwd" id="pwd">
<span id="pwd_error"></span> </p>
<p>
确认密码：
</p>
<p>
<input type="text" name="repwd" id="repwd">
<span id="repwd_error"></span>
</p>
<input type="submit" value="提交" />
</form> <script src="jquery.js"></script> <script> $("form").submit(function () { $("input[type='text']").trigger('blur'); total = ;
$("input[type='text']").each(function () {
// total += parseInt($(this).attr("s"));
total += $(this).data("s");
}); console.log(total);
if(total != ){
return false;
} }); $("#username").blur(function () {
var username = $(this).val();
if(username.length < ){
$(this).data({"s":});
$("#username_error").text("用户名小于6位").css({"color":"red"});
}else{
$(this).data({"s":});
$("#username_error").text("");
}
}); $("#pwd").blur(function () {
var pwd = $(this).val();
if(pwd.length < ){
$(this).data({"s":});
$("#pwd_error").text("密码小于8位").css({"color":"red"});
}else{
$(this).data({"s":});
$("#pwd_error").text("");
}
}); $("#repwd").blur(function () {
var pwd = $("#pwd").val();
var repwd = $(this).val();
if(pwd != repwd){
$(this).data({"s":});
$("#repwd_error").text("两次密码不一致").css({"color":"red"});
}else{
$(this).data({"s":});
$("#repwd_error").text("");
}
}); </script> </body>
</html>