formValidator使用小记

formValidator是一个很好的表单验证框架,由于才刚开始了解,用了只有几天,先把目前知道你的使用方法记下来,以后有发现再添加。

这里有一个很好地关于各个类型的使用的网址http://www.cnblogs.com/talk/archive/2012/01/29/2330887.html

我这里只是介绍一种例子,知道了一种使用,其他的就都会用了

首先是使用:

基本的包formValidator_min.js,formValidatorRegex.js,当然还有jQueri的包,直接官网下载,下面的文件中也有

使用很简单,比方说输入框是这样的

<input style="width: 200px;height:20px;" id="mobileTyp"/><span class="onError" style="padding-left:10px" id="mobileTypeTip">输入手机号码</span>

 注意两个id号的区别,js代码为

$("#mobileType").formValidator({ onshow: "内容不能为空", onfocus: "请输入手机号码", oncorrect: "<span style='color:green'>格式正确</span>" }).inputValidator({ min: 11, max: 11, onerror: "手机号码长度不对" }).regexValidator({ regexp: "mobile", datatype: "enum",onerror: "手机号码格式不正确" });

 好了,完成,输入内容的室友会有验证,表单提交的时候也有验证

今天遇到一个非常头疼的问题,验证文件上传,找各种例子找不到,官网的文档一点都不详细,弄了好久,关键是我的文件上传的输入框还是使用.append()方法加进去的,尝试了各种办法,一直没有弄出来,最后使用了functionValidator()方法才搞定的,代码如下:

$("#fileType").formValidator({ onshow: "文件不能为空", onfocus: "请输入文件", oncorrect: "<span style='color:green'>格式正确</span>" }).functionValidator({
				            fun: function (val, elem) {
					    alert(val);//为上传文件的路径和名字
						//chooseType为允许上传文件的格式,以加号分隔
				                for(var i=0;i<=chooseType.split('+').length;i++){
				                	chooseType = chooseType.replace("+","|");
				                }
				           	 //匹配格式
				      var m =val.split('.')[val.split('.').length-1].match(chooseType);
				           	if(m==null){
				           	 $("#fileType"+i+"Tip").html("格式错误");
				           		return false;
				           		} 
				$("#fileType"+i+"Tip").html("<span style='color:green'>正确</span>");
				           	return true;
				            }
				        }); 

 由于我也是刚开始使用该控件,所以我也有很多地方没弄明白,上面的代码是质量不怎么高,但是是可以用的,先用起来再说,以后有问题再改,欢迎大家参与讨论。

在使用checkbox的时候,使用该控件好像不行,反正我是没成功的,如果有人知道怎么使用该控件验证多选按钮,希望能分享一下,再此谢谢了。我最终解决多选按钮的方法是用js代码设置多选默认选中一项,而且至少选中一项,这样就不需要验证了。设置代码如下:

$('.checkboxType').change(function(){
					var c_chenked = 0
					for(var j=0;j<$('.checkboxType').length;j++){
						if($('.checkboxType')[j].checked){c_chenked++;}
					}
					if(c_chenked == 0){$(this)[0].checked=true;}
					});

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值