锁定老帖子 主题:javascript通用验证方法大全及用法
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
|
|
---|---|
作者 | 正文 |
发表时间:2011-11-09
最后修改:2011-11-18
前不久在一家小公司做项目总结出来的javascript验证方法,现在分享给大家。不过,我是初手,应该有很多疏漏,请各位大哥大姐们多多指教。
// 在GBK编码里,除了ASCII字符,其它都占两个字符宽 function get_bytes_length(str) { return str.replace(/[^\x00-\xff]/g, "xx").length; }
//去除所有空格 function trim(obj) { var not_valid = /\s/; while (not_valid.test(obj)) { obj = obj.replace(not_valid, ""); } return obj; }
//只能输入数字、字母、下划线 function nlu(obj) { var valid = /^\w*$/; return (valid.test(obj)); }
//普通验证(obj:要验证的输入框的id;maxsize:可输入最大字符长度;isNull:是否为必填项) function check_obj1(obj, maxsize, isNull) { //获取输入框值 var v = document.getElementById(obj).value; //是必填项 if (isNull) { if (v == "") { document.getElementById("vd_" + obj).innerText = "不能空!"; return false; } } //超过指定长度 if (get_bytes_length(trim(v)) > maxsize) { document.getElementById("vd_" + obj).innerText = "\u53ea\u80fd\u8f93\u5165" + (maxsize / 2) + "\u4f4d\u4ee5\u5185\u7684\u4e2d\u6587\u6216" + maxsize + "\u4f4d\u4ee5\u5185\u82f1\u6587\u5b57\u7b26!"; return false; } if(isNull){ document.getElementById("vd_" + obj).innerText = "*"; return true; }else{ document.getElementById("vd_" + obj).innerHTML = "<font color='green'>\u8f93\u5165\u6b63\u786e!</font>"; return true; } }
//验证数字(obj:要验证的输入框的id;maxsize:可输入最大字符长度;isNull:是否为必填项;isNumber:是否只能输入数字) function check_obj2(obj, maxsize, isNull, isNumber) { //获取输入框值 var v = document.getElementById(obj).value; //是必填项 if (isNull) { if (v == "") { document.getElementById("vd_" + obj).innerText = "不能空!"; return false; } } //超过指定长度 if (get_bytes_length(trim(v)) > maxsize) { document.getElementById("vd_" + obj).innerText = "\u6700\u591a\u8f93\u5165" + maxsize + "\u4e2a\u6570\u5b57!"; return false; } //只能是数字 if (isNumber) { if (isNaN(v)) { document.getElementById("vd_" + obj).innerText = "\u53ea\u80fd\u8f93\u5165\u6570\u5b57!"; return false; } }
if(isNull){ document.getElementById("vd_" + obj).innerText = "*"; return true; }else{ document.getElementById("vd_" + obj).innerHTML = "<font color='green'>\u8f93\u5165\u6b63\u786e!</font>"; return true; } }
//验证数字、字母、下划线(obj:要验证的输入框的id;maxsize:可输入最大字符长度;isNull:是否为必填项;isNLU:是否为数字、字母、下划线) function check_obj3(obj, maxsize, isNull, isNLU) { //获取输入框值 var v = document.getElementById(obj).value; //是必填项 if (isNull) { if (v == "") { document.getElementById("vd_" + obj).innerText = "\u4e0d\u80fd\u4e3a\u7a7a!"; return false; } } //超过指定长度 if (get_bytes_length(trim(v)) > maxsize) { document.getElementById("vd_" + obj).innerText = "\u53ea\u80fd\u8f93\u5165" + (maxsize / 2) + "\u4f4d\u4ee5\u5185\u7684\u4e2d\u6587\u6216" + maxsize + "\u4f4d\u4ee5\u5185\u82f1\u6587\u5b57\u7b26!"; return false; } //只能是数字、字母、下划线 if (isNLU) { if (!nlu(v)) { document.getElementById("vd_" + obj).innerText = "\u53ea\u80fd\u8f93\u5165\u6570\u5b57\u3001\u5b57\u6bcd\u3001\u4e0b\u5212\u7ebf!"; return false; } } if(isNull){ document.getElementById("vd_" + obj).innerText = "*"; return true; }else{ document.getElementById("vd_" + obj).innerHTML = "<font color='green'>\u8f93\u5165\u6b63\u786e!</font>"; return true; } }
//电话验证(obj:要验证的输入框的id;maxsize:可输入最大字符长度;isNull:是否为必填项) function check_obj4(obj, maxsize, isNull) { //获取输入框值 var v = document.getElementById(obj).value; //是必填项 if (isNull) { if (v == "") { document.getElementById("vd_" + obj).innerText = "\u4e0d\u80fd\u4e3a\u7a7a!"; return false; } } var reg=/(^[0-9]{3,4}\-[0-9]{3,8}$)|(^[0-9]{3,8}$)|(^\([0-9]{3,4}\)[0-9]{3,8}$)|(^0{0,1}13[0-9]{9}$)/; if(!reg.test(v)){ document.getElementById("vd_" + obj).innerText = "格式错误!"; return false; } //超过指定长度 if (get_bytes_length(trim(v)) > maxsize) { document.getElementById("vd_" + obj).innerText = "\u53ea\u80fd\u8f93\u5165" + (maxsize / 2) + "\u4f4d\u4ee5\u5185\u7684\u4e2d\u6587\u6216" + maxsize + "\u4f4d\u4ee5\u5185\u82f1\u6587\u5b57\u7b26!"; return false; } if(isNull){ document.getElementById("vd_" + obj).innerText = "*"; return true; }else{ document.getElementById("vd_" + obj).innerHTML = "<font color='green'>\u8f93\u5165\u6b63\u786e!</font>"; return true; } }
//验证小数点(obj:要验证的输入框的id;maxsize:可输入最大字符长度;isNull:是否为必填项;floatsize:小数点后长度;) function check_obj5(obj, maxsize,isNull,floatsize) { //获取输入框值 var v = document.getElementById(obj).value;
//是必填项 if (isNull) { if (v == "") { document.getElementById("vd_" + obj).innerText = "\u4e0d\u80fd\u4e3a\u7a7a!"; return false; } }
var counts=0;//是否有小数点 var j,c; for(j=0;j<v.length;j++){ c=v.charAt(j) if(( c >= '0' && c <= '9')||( c == ".")){ if(c=='.'){ counts++; } }else{ document.getElementById("vd_" + obj).innerText = "只能输入数字和小数点!"; return false; } } if(counts>=1){//存在小数点 if(counts==1){//只有一个小数点时 if(isNaN(v.substring(0,(maxsize-floatsize)))){ document.getElementById("vd_" + obj).innerText = "小数点前面只能为数字!"; return false; }else if(v.substring(0,v.indexOf('.')).length>(maxsize-floatsize)){ document.getElementById("vd_" + obj).innerText = "小数点前面只能为"+(maxsize-floatsize)+"位数字!"; return false; }else if(v.substring(v.indexOf('.')+1).length>floatsize){ document.getElementById("vd_" + obj).innerText = "小数点后面只能为"+floatsize+"位数字!"; return false; }else if(v.length>(maxsize+1)){ document.getElementById("vd_" + obj).innerText = "长度超过范围!"; return false; }else{ if(isNull){//必填项显示星号 document.getElementById("vd_" + obj).innerText = "*"; return true; }else{//否则显示输入正确 document.getElementById("vd_" + obj).innerHTML = "<font color='green'>\u8f93\u5165\u6b63\u786e!</font>"; return true; } } }else{//存在多个小数点时 document.getElementById("vd_" + obj).innerText = "小数点多了!"; return false; } }else{//不存在小数点 if(v.length>(maxsize-floatsize)){ document.getElementById("vd_" + obj).innerText = "小数点前面只能为" + (maxsize-floatsize) + "位数字!"; return false; }else{ if(isNull){//必填项显示星号 document.getElementById("vd_" + obj).innerText = "*"; return true; }else{//否则显示输入正确 document.getElementById("vd_" + obj).innerHTML = "<font color='green'>\u8f93\u5165\u6b63\u786e!</font>"; return true; } } } }
//密码验证 function obj1_equals_obj2(obj1,obj2){ var v1 = document.getElementById(obj1).value; var v2 = document.getElementById(obj2).value; if(v1!=v2){ document.getElementById("vd_" + obj2).innerText = "两次密码不一致!"; return false; }else{ document.getElementById("vd_" + obj2).innerText = "*"; return true; } } 用法举例:
//客户名称
$("#customerId").keyup(function validate_customerId(){
return check_obj1("customerId",6,true);
});
//本次合计应付款额
$("#mustpay").keyup(function validate_mustpay(){
return check_obj5("mustpay",16,true,2);
});
////////////////////////////////批量验证//////////////////////////////////
$(function validate_detail(){
var false_count=0;//记录不合法数据数量
//委托单号
$("input[title='委托单号']").each(function(i){
$("#deliverscatbill"+(i+1)).keyup(function validate_capPlancontactH(){
return check_obj1("deliverscatbill"+(i+1),20,true);
});
if(!validate_capPlancontactH()){
false_count=false_count+1;
}
});
//车号
$("input[title='车号']").each(function(i){
$("#vehicleId"+(i+1)).keyup(function validate_vehicleId(){
return check_obj1("vehicleId"+(i+1),10,true);
});
if(!validate_vehicleId()){
false_count=false_count+1;
}
});
//应付运费
$("input[name='cdItem.mustpay']").each(function(i){
$("#mustpay"+(i+1)).keyup(function validate_mustpay(){
return check_obj5("mustpay"+(i+1),16,true,2);
});
if(!validate_mustpay()){
false_count=false_count+1;
}
});
if(false_count>0){//只要存在不合法数据就返回假,否则返回真
return false;
}else{
return true;
}
});
声明:ITeye文章版权属于作者,受法律保护。没有作者书面许可不得转载。
推荐链接
|
|
返回顶楼 | |
发表时间:2011-11-17
想这些代码在平时开发时候可以多记录一下,以后开发要校验的时候就很方便了。
|
|
返回顶楼 | |
发表时间:2011-11-18
楼主头像不赖啊
|
|
返回顶楼 | |
发表时间:2011-11-22
好多重复代码
|
|
返回顶楼 | |
发表时间:2011-11-24
好像很老的代码了
|
|
返回顶楼 | |
发表时间:2011-11-25
补充:给出意见的大哥,麻烦顺便举个例子。
|
|
返回顶楼 | |
浏览 3805 次