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>

原创粉丝点击