jquery.validate是jquery的一个插件,用来辅助开发者在客户端方便快捷的实现表单验证,最终达到提高用户体验的目的。

创新互联公司服务项目包括澄迈网站建设、澄迈网站制作、澄迈网页制作以及澄迈网络营销策划等。多年来,我们专注于互联网行业,利用自身积累的技术优势、行业经验、深度合作伙伴关系等,向广大中小型企业、政府机构等提供互联网行业的解决方案,澄迈网站推广取得了明显的社会效益与经济效益。目前,我们服务的客户以成都为中心已经辐射到澄迈省份的部分城市,未来相信会继续扩大服务区域并继续获得客户的支持与信任!
官网:
http://plugins.jquery.com/validate/
示例代码
index.cshtml
@section scripts{ }jquery.validate在定位html标签的时候,默认使用name属性来获取标签,所以需要开发者给需要进行验证的标签都加上name属性,并且赋值。
index.js
$().ready(function () {
$("#formLogin").validate({
rules: {
username: {
required: true
},
password: {
required: true
},
sex: {
required: true
},
level: {
required: true
},
favorite: {
required: true
}
},
messages: {
username: {
required: "please input username"
},
password: {
required: "please input password"
},
sex: {
required: "please select sex"
},
level: {
required: "level requred"
},
favorite: {
required: "favorite required"
}
},
errorPlacement: function (error, element) { //指定错误信息位置
if (element.is(':radio') || element.is(':checkbox')) { //如果是radio或checkbox
var eid = element.attr('name'); //获取元素的name属性
error.appendTo(element.parent()); //将错误信息添加当前元素的父结点后面
} else {
error.insertAfter(element);
}
}
});
});
$("#submit").click(function () {
$("#submit").submit();
});有时候我们需要使用正则表达式对一些输入进行验证,比如说邮箱,电话号码,或者是用户名必须字母开头并且长度要在5-30位,等等之类的。
jquery.validate默认没有提供正则表达式的验证,但是它提供了一个扩展,我们可以自己添加关于正则表达式的验证规则。
$(function () {
// 判断用户输入的value是否满足传入的正则params的规范
jQuery.validator.addMethod("pattern", function (value, element, params) {
if (!params.test(value)) {
return false;
}
return true;
});
});这样我们就可以像下面这样使用我们自定义的正则表达式验证了。
$().ready(function () {
$("#formLogin").validate({
rules: {
tel: {
required:true,
pattern: /^[0-9]+$/
}
},
messages: {
tel: {
required:'tel required',
pattern: "regex error"
}
}
});
});怎么样,是不是很酷啊!
$("#formSupplier").validate还有一些其他的参数,跟多的参数可以查看
http://blog.csdn.net/a497785609/article/details/5758613
在这里先介绍两个比较常用的。
errorElement
错误提示的html标签
submitHandler
验证成功之后的操作
$("#formSupplier").validate({
errorElement: "span",
submitHandler: function (form) {
if (btnType == 1) {
submitUpdateSupplier();
} else {
offShelf();
}
},
rules: {
txtSuUserName: {
required: true,
pattern: regexUsername
}
},
messages: {
txtSuUserName: {
required: "请填写编号!",
pattern: "请注意,编号只能使用3-15位的字母组合!"
}
}
});
当前题目:jquery.validate验证text,checkbox,radio,selected
链接URL:http://lzwzjz.cn/article/pppihc.html


咨询
建站咨询
