jquery的校验规则的方法
//validate 选项***********************************************************
$("form").validate({
debug:true //进行调试模式(表单不提交)
rules:{
name:"required", //自定义规则,key:value的形式,key是要验证的元素,value可以是字符串或对象
email:{
//内置验证方式
required:true, //必填项
required:"#aa:checked"表达式的值为真,则必填项
required:function(){}返回为真,则必填项
email:true, //验证电子邮箱格式
minlength:5, //设置最小长度
maxlength:10, //设置最大长度
rangelength:[5,10],//设置一个长度范围[min,max]
min:2, //设置最小值
max:8, //设置最大值
range:[2,8] //设置值的范围
url:true, //验证URL格式
date:true, //验证日期格式(类似30/30/2008的格式,不验证日期准确性只验证格式)
dateISO:true, //验证ISO类型的日期格式 例如:2009-06-23
dateDE:true, //验证德式的日期格式(29.04.1994 or 1.1.2006)
number:true, //验证十进制数字(包括小数的)
digits:true, //验证整数
creditcard:true, //验证信用卡号
accept:"" //请输入拥有合法后缀名的字符串(上传文件的后缀)
equalTo:"id名" //验证两个输入框的内容是否相同
phoneUS:true //验证美式的电话号码
regex:/正则表达式/ //上面addMethod扩展的验证规则
}
}
messages:{
name:"Name不能为空", //自定义的提示信息key:value的形式key是要验证的元素,值是字符串或函数
email:{
required:"E-mail不能为空",
email:"E-mail地址不正确" //validate 内置验证有默认的英语提示 此处为重新自定义
}
}
errorPlacement: function(error,element) {
element.parents('.form-group').children(".help-block").html(error); //错误显示的位置 element验证的元素error错误提示
}
submitHandler:function(form) {//通过验证后运行的函数,里面要加上表单提交的函数,否则表单不会提交
$(form).ajaxSubmit();
//form.submit();
}
success:"类名" //要验证的元素通过验证后的动作,跟一个字符串,会给输出错误的元素追加一个css类
ignore:".ignore" //对某些元素不进行验证
onsubmit:false //是否提交时验证 默认:true
onfocusout:false //是否在获取焦点时验证 默认:true
onkeyup:false //是否在敲击键盘时验证 默认:true
onclick:false //是否在鼠标点击时验证(一般验证checkbox,radiobox) 默认:true
focusInvalid:false //提交表单后,未通过验证的表单(第一个或提交之前获得焦点的未通过验证的表单)会获得焦点 默认:true
focusCleanup:true //当未通过验证的元素获得焦点时,并移除错误提示(避免和 focusInvalid.一起使用)默认:false
errorClass:"类名" //指定错误提示的css类名,可以自定义错误提示的样式 默认:"error"
errorElement:"标签" //使用什么标签标记错误 默认:"label"
wrapper:"标签" //使用什么标签再把上边的errorELement包起来
errorLabelContainer:"容器id" //把错误信息统一放在一个容器里面
showErrors:function(errorMap,errorList) { //跟一个函数,可以显示总共有多少个未通过验证的元素
$("#summary").html("Your form contains " + this.numberOfInvalids() + " errors,see details below.");
this.defaultShowErrors();
}
})
//validate方法 返回一个Validator对象,它有很多方法, 让你能使用引发校验程序或者改变form的内容**************
$.validator.setDefaults({//设置validator默认
debug:true, //把调试模式设置为默认 如果一个页面中有多个表单一般用这种方式
errorClass: "txt-impt", //设置默认错误提示的css类名
errorElement: "div" //设置默认错误提示的标签
})
//addMethod(name,method,message)方法:name(自定义rules的key) method(自定义验证方法) message(报错输出的提示)
jQuery.validator.addMethod("regex",function(value, element, params){ //扩展方法示例:
var exp = new RegExp(params); //params rules的value传入的正则表达式
return exp.test(value); //value 被验证的input传入的值
},"输入格式有误");
//扩展rules规则
jQuery.validator.addClassRules("name", {
required: true,
minlength: 2
});
jQuery.validator.addClassRules({
name: {
required: true,
minlength: 2
},
zip: {
required: true,
digits: true,
}
});
$("#myinput").rules("add", {
required: true,
minlength: 2,
messages: {
required: "Required input",
minlength: jQuery.format("Please, at least {0} characters are necessary")
}
});
$("#myinput").rules("remove"); //全部移除验证规则
$("#myinput").rules("remove", "min max") //移除 min max
var form=$('form');
$(".formBtn").click(function(){ //按钮type非submit or submit按钮不在form内
console.log("Valid: " + form.valid()) //form.valid() 验证成功返回true
var validator = $("form").validate(setValidate);
var formState=validator.form(); //判断验证状态 返回Boolean
//validator.element("id名") 验证某个元素 返回Boolean
//validator.resetForm() 把前面验证的FORM恢复到验证前原来的状态
/*validator.showErrors({
"firstname": "I know that your firstname is Pete, Pete!"
}); 显示自定义的错误信息 */
if(formState==false){
return;
}else{
//do someing...
}
})
//使用ajax方式进行验证,默认会提交当前验证的值到远程地址,如果需要提交其他的值,可以使用data选项 后台只允许返回false和true
remote: "check-email.php"
remote: {
url: "check-email.php", //后台处理程序
type: "post", //数据发送方式
dataType: "json", //接受数据格式
data: { //要传递的数据
username: function() {
return $("#username").val();
}
}
}
//meta String方式***************************************************************
//引入js
<script type="text/javascript" src="js/jquery.metadata.js"></script>
<script type="text/javascript" src="js/jquery.validate.js"></script>
//dom上验证规则写法
<input type="text" name="email" class="{validate:{ required:true,email:true }}" />
//设置为meta String验证方式
$("#myform").validate({
meta:"validate",
submitHandler:function() { alert("Submitted!") }
})
jquery的校验规则的方法的更多相关文章
- jQuery EasyUI---validatebox 校验规则扩展
EasyUI 的 validatebox 插件, 验证规则相对比较单一也比较少,如下. rules: { email:{ validator: function(value){ return ...? ...
- jQuery Validate 表单验证插件----利用jquery.metadata.js将校验规则直接写在class属性里面并定义错误信息的提示
一.下载依赖包 网盘下载:https://yunpan.cn/cryvgGGAQ3DSW 访问密码 f224 二. 添加一个另外一个插件jquery.metadata.js 并把校验规则写在控件里面 ...
- jQuery Validate 表单验证插件----在class属性中添加校验规则进行简单的校验
一.下载插件包. 网盘下载:https://yunpan.cn/cryvgGGAQ3DSW 访问密码 f224 二.jQuery表单验证插件----添加class属性形式的校验 <!DOCTY ...
- jQuery Validate 验证,校验规则写在控件中的具体例子
将校验规则写到控件中 <script src="../js/jquery.js" type="text/javascript"></scrip ...
- jQuery Validate 表单验证插件----通过name属性来关联字段来验证,改变默认的提示信息,将校验规则写到 js 代码中
一.下载依赖包 网盘下载:https://yunpan.cn/cryvgGGAQ3DSW 访问密码 f224 二. 添加一个另外一个插件jquery.validate.messages_cn.js. ...
- jquery.validate动态更改校验规则
有时候表单中有多个字段是相互关联的,以下遇到的就是证件类型和证件号码的关联,在下拉框中选择不同的证件类型,证件号码的值的格式都是不同的,这就需要动态的改变校验规则. 点击(此处)折叠或打开 <! ...
- jquery.validate动态更改校验规则 【转】
有时候表单中有多个字段是相互关联的,以下遇到的就是证件类型和证件号码的关联,在下拉框中选择不同的证件类型,证件号码的值的格式都是不同的,这就需要动态的改变校验规则. <!DOCTYPE html ...
- Jquery Validate动态添加和删除校验规则
以下面文本框为例, <input type="text"name="username" id="username"/> 我们要让 ...
- Jquery客户端校验——jquery.validate.js
jQuery Validate 插件为表单提供了强大的验证功能,让客户端表单验证变得更简单,同时提供了大量的定制选项,满足应用程序各种需求.该插件捆绑了一套有用的验证方法,包括 URL 和电子邮件验证 ...
随机推荐
- C# Monads的实现(一)
了解Haskell语言的朋友都知道它是一门纯函数式编程,输出结果只跟输入参数相关,这导致Haskell不能有输入输出函数,因为不同的环境下,输入相同,但输出可能有所不同.Haskell语言中,变量的值 ...
- NSConditionLock
一.NSConditionLock定义了一个可以指定条件的互斥锁,用于线程之间的互斥与同步. 这里的条件并不是bool表达式中的条件,而是一个特定的int值. 二.NSConditionLock的AP ...
- UVA 624 CD (01背包)
//路径记录方法:若是dp[j-value[i]]+value[i]>dp[j]说明拿了这个东西,标志为1, //for循环标志,发现是1,就打印出来,并把背包的容量减少,再在次容量中寻找标志: ...
- Cenots安装openvpn、pam_mysql进行用户认证和流量控制
一.安装Centos6.5 二.修改YUM仓库 1. 默认仓库不能访问部分软件包,因此我们需要修改YUM仓库 cd /etc/yum.repos.d #备份 mv ./CentOS-Base.repo ...
- 在textarea的内容后面增加内容
document.getElementById("result").value+=data+"\n>"; 本文为本人用来记录自己做的一些东西,如有不对的地 ...
- 十五、oracle 约束
一.维护数据的完整性数据的完整性用于确保数据库数据遵从一定的商业和逻辑规则,在oracle中,数据完整性可以使用约束.触发器.应用程序(过程.函数)三种方法来实现,在这三种方法中,因为约束易于维护,并 ...
- Sublime Text: [Decode error - output not utf-8]
今天编译Python时, 输出窗口信息出现: [Decode error - output not utf-8][Decode error - output not utf-8] 发现是print ...
- 初次使用IntelliJ IDEA 2016.2
换电脑的还有一个目的就是我准备采用新的IDE了 之前一直用的是myeclipse,但是现在准备尝试idea 这边做个记录,idea的破解参考下面这个网址:http://blog.csdn.net/u0 ...
- 第一次使用unity3d
今天暂且做个记录,因为第一使用了unity3d,进行了很长时间的安装和调试,进行了简单的使用,能简单的在页面上面建立了一个方块和一个球. 简单了解了unity中的一些基本概念.总结一下,一个物体可以有 ...
- 《JS权威指南学习总结--第二章词法结构》
第二章词法结构 内容要点: 一.注释 1. //表示单行注释 2. /*这里是一段注释*/ 3.一般编辑器里加注释是:选中要加注释的语句,按 ctrl+/ 二.直接量 所谓直接量,就是程序中直接使用的 ...