欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识！
您现在的位置是： 首页  >  web前端

validate自动校验

程序员文章站 2022-06-06 11:10:44
...
<!DOCTYPE html> 
<html> 
<head> 
<meta charset="UTF-8"> 
<title>自动校验功能</title> 
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script> 
<script type="text/javascript" src="js/validate.js"></script> 
<style type="text/css"> 
.suc{ 
background-color: red; 
} 
</style> 
<script type="text/javascript"> 
$(function() { 
//自定义校验方法addMethod中的参数1:验证的方法名，参数2：验证规则，参数3：验证提示信息 
$.validator.addMethod("formula",function(value,element,param){ 
return this.value == eval(param);	
},'请正确输入数学计算正确后的结果'); 

      $("#form1").validate({ 
      rules:{ 
       username:{ 
       required:true, 
       minlength:2 
       }, 
      email:{ 
      required:true, 
      email:true 
      }, 
      url:{ 
      required:true, 
      url:true 
      }, 
      valcode:{ 
      formula: "7+9" 
      } 
         }, 
        /*  messages{ 
        username:{ 
        required:'请输入姓名', 
        minlength:'请至少输入两个字符' 
        }, 
        email:{ 
        required:'请输入电子邮箱', 
         email:'请检查电子邮箱格式' 
        } 
         }, */ 
         /* 
         errorElement:"em",//用来创建错误提示信息 
         success:function(label){//验证成功后执行的回调函数，label指向上面那个错误提示信息标签em 
        label.text(" ").addClss("suc");//清空错误提示信息,并添加上样式 
         } */ 
      }); 
}); 
</script> 
</head> 
<body> 
<form action="#" method="post" id="form1"> 
用户名:<input type="text" name="username" value=""><br><br> 
年&nbsp;龄:<input type="text" name="age" value=""><br><br> 
邮&nbsp;箱:<input type="text" name="email" value=""><br><br> 
地&nbsp;址:<input type="text" name="url" value=""><br><br> 
<label for="cvalcode">验证码:</label> 
<input id="cvalcode" type="text" name="valcode" size="25" value="">=7+9 
<input type="button" value="提交"> 
</form> 
</body> 
</html>
相关标签： html JavaScript validate validate自动校验

上一篇： Eclipse(myeclipse)连接SQL Server 2008数据库

下一篇： C#读取XML的三种实现方式的代码详解

推荐阅读