<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery.Validate</title>
<script src="jquery-1.10.2.min.js"></script>
<script src="jquery.validate.min.js"></script>
<script>
$(function () {
$("#registerForm").validate({
rules: {
username: {
required: true,
minlength: 6
},
password: {
required: true,
minlength: 8
},
confirm_password: {
required: true,
minlength: 8,
equalTo: "#password"
}
},
messages: {
username: {
required: "请输入用户名",
minlength: "用户名最少6位"
},
password: {
required: "请输入密码",
minlength: "密码长度不能小于8位"
},
confirm_password: {
required: "请输入密码",
minlength: "密码长度不能小于8位",
equalTo: "两次密码输入不一致"
}
}
});
});
</script>
<style>
.error {
color: red;
}
</style>
</head>
<body>
<form class="cmxform" id="registerForm" method="get" action="">
<p>
<label for="username">请输入用户名</label>
<input id="username" name="username" type="text">
</p>
<p>
<label for="password">请输入密码</label>
<input id="password" name="password" type="password">
</p>
<p>
<label for="confirm_password">再次输入密码</label>
<input id="confirm_password" name="confirm_password" type="password">
</p>
<p>
<input type="submit" value="注册">
</p>
</form>
</body>
</html>