<form action="" method="post" id="login">
<label>用户名:</label><input name="username" type="text" />
<label>邮件地址:</label><input name="email" type="text" />
<label>密 码:</label><input id="password" name="password" type="password" />
<label>确认密码:</label><input name="confirm_password" type="password" />
<input name="userinfosub" type="submit" value="提交" />
</form>
<label>用户名:</label><input name="username" type="text" />
<label>邮件地址:</label><input name="email" type="text" />
<label>密 码:</label><input id="password" name="password" type="password" />
<label>确认密码:</label><input name="confirm_password" type="password" />
<input name="userinfosub" type="submit" value="提交" />
</form>
然后引入下面这四个js文件:
<script src="../js/jquery.js" type="text/网页特效"></script>
<script src="../js/jquery.validate.js" type="text/javascript"></script>
<script src="./js/jquery.metadata.js" type="text/javascript"></script>
<script src="./js/messages_cn.js" type="text/javascript"></script>
<script src="../js/jquery.js" type="text/网页特效"></script>
<script src="../js/jquery.validate.js" type="text/javascript"></script>
<script src="./js/jquery.metadata.js" type="text/javascript"></script>
<script src="./js/messages_cn.js" type="text/javascript"></script>
然后自定义一个js文件,这个js文件的内容如下:
$("#login").validate({
rules: {
username: {
required: true,
minlength: 2
},
email: {
required: true,
email: true
},
password: {
required: true,
minlength: 6
},
confirm_password: {
required: true,
minlength: 6,
equalto: "#password"
}
},
messages: {
username: {
required: "<span style='color:red'> 请输入用户名</span>",
minlength: jquery.format("<span style='color:red'> 用户名不正确,应该在2个汉字或四个字符以上</span>")
},
email: {
required: "<span style='color:red''>请输入email地址</span>",
email: "<span style='color:red'> 请输入正确的email地址</span>"
},
password: {
required: "<span style='color:red'> 请输入密码</span>",
minlength: jquery.format("<span style='color:red'> 您输入的密码不正确,应该在6位或6位字符以上</span>")
},
confirm_password: {
required: "<span style='color:red'>请输入确认密码</span>",
minlength: jquery.format("<span style='color:red'> 您输入的密码不正确,应该在6位或6位字符以上</span>"),
equalto: "<span class='fred'>两次输入密码不一致</span>"
}
}
});
$("#login").validate({
rules: {
username: {
required: true,
minlength: 2
},
email: {
required: true,
email: true
},
password: {
required: true,
minlength: 6
},
confirm_password: {
required: true,
minlength: 6,
equalto: "#password"
}
},
messages: {
username: {
required: "<span style='color:red'> 请输入用户名</span>",
minlength: jquery.format("<span style='color:red'> 用户名不正确,应该在2个汉字或四个字符以上</span>")
},
email: {
required: "<span style='color:red''>请输入email地址</span>",
email: "<span style='color:red'> 请输入正确的email地址</span>"
},
password: {
required: "<span style='color:red'> 请输入密码</span>",
minlength: jquery.format("<span style='color:red'> 您输入的密码不正确,应该在6位或6位字符以上</span>")
},
confirm_password: {
required: "<span style='color:red'>请输入确认密码</span>",
minlength: jquery.format("<span style='color:red'> 您输入的密码不正确,应该在6位或6位字符以上</span>"),
equalto: "<span class='fred'>两次输入密码不一致</span>"
}
}
});
0 意見:
張貼留言