jquery的Validation插件
来源:互联网 发布:淘宝b2c 编辑:程序博客网 时间:2024/05/19 18:00
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><!-- charset--><script src="../../dreamweaver/jquery.min.js"></script><script src="jquery.validate.js"></script><script src="jquery.metadata.js"></script><script src="jquery.validate.messages_cn.js"></script> <!-- 验证信息的中文信息库--><title>Validation插件</title><script>$(document).ready(function(){ $.validator.addMethod("formula", //验证方法名称function(value, element, param) {//验证规则return value==eval(param);}, '请正确输入数学公式计算后的结果'//验证提示信息); // $("#myform").validate({meta:"validate"}); //不同的调用方式 $("#myform").validate({ rules:{ id:{ required:true, minlength:6 }, mima:{ required:true, minlength:7 }, youxiang:"email", wangzhi:"url", yanzhengma:{formula:"7+3"}}, errorElement: "em", success: function(label) {label.text(" ").addClass("success");}, messages:{ id:"自定义,长度必须大于6", mima:"自定义:长度必须大于7", yanzhengma:"自定义:请输入正确验证码" } }); });</script><style>em.error{ background-image: url(../源码/锋利的jquery源码/《锋利的jQuery》实例源码/实例下载/07第七章/第七章例子/7-1-Validation/images/unchecked.gif); background-repeat:no-repeat; padding-left:20px; color:red;}em.success{ background-image:url(../源码/锋利的jquery源码/《锋利的jQuery》实例源码/实例下载/07第七章/第七章例子/7-1-Validation/images/checked.gif); background-repeat:no-repeat; padding-left:20px;}</style></head><body><form action="#" method="get" id="myform"><fieldset><legend>Validation插件</legend><!--<p><label>用户名:</label><input name="id" class="{validate:{required:true,minlength:5}}" type="text" size="100" /></p><p><label>密码: </label><input name="mima" class="{validate:{required:true,minlength:6}}" type="password" size="100" /></p><p><label>邮箱: </label><input name="youxiang" class="{validate:{required:true,email:true}}"type="text" size="100" /></p><label>网址: </label><input name="wangzhi" class="{validate:{required:true,url:true}}" type="text" size="100" /><p> <input name="mysubmit" type="submit" /></p>--><p><label>用户名:</label><input name="id" type="text" size="100" /></p><p><label>密码: </label><input name="mima" type="password" size="100" /></p><p><label>邮箱: </label><input name="youxiang" type="text" size="100" /></p><label>网址: </label><input name="wangzhi" type="text" size="100" /><p><label>验证码: </label><input name="yanzhengma" type="text" size="100" value=""/><label> 7+3 </label></p><p> <input name="mysubmit" type="submit" /></p></fieldset></form></body></html>