页面各种js验证大全

  • 格式:docx
  • 大小:19.16 KB
  • 文档页数:13

var haveError;var errorMsgColor ="color:red"; //(样式)错误消息的颜色var firstMsgColor = "color: #888"; //(样式)初始的提示语的颜色用于之后的判断,中间要加空格,全文小写function basicInit(object){//初始化基本方法var msgStyle =$(object).next().attr("style");msgStyle = msgStyle.toLowerCase();var msgContent=$(object).next().html();if(msgStyle.indexOf(firstMsgColor)!=-1 && jQuery.trim(msgContent)!=''){//如果有默认提示语,则存储起来$(object).attr("firstMsg",msgContent); //提示语内容$(object).attr("firstMsgColor",msgStyle);//保留提示语原先样式}$(object).next().text('');//把验证对象后面的提示信息清空}//文本框验证初始化function checkInit(object){basicInit(object);$(object).val(jQuery.trim($(object).val()));//去掉左右空格}//通过验证后,补写提示语function supplyMsg(object){if($(object).attr("firstMsg")!=undefined){$(object).next().text($(object).attr("firstMsg"));$(object).next().attr("style",$(object).attr("firstMsgColor"));}}//非空验证function required(object,msg){checkInit(object);if($(object).val().length==0){$(object).next().text(msg).attr("style",errorMsgColor);haveError = true;return false;}supplyMsg(object);return true;}//最大长度验证(所要验证的对象,文本的长度,出错后的提示信息) function maxLength(object,textlength,msg){checkInit(object);var len=0;for(var i=0;i<$(object).val().length;i++){var intCode=$(object).val().charCodeAt(i);if (intCode>=0&&intCode<=128){len=len+1;}else{len=len+3;}}if(len >textlength){$(object).next().text(msg).attr("style",errorMsgColor);haveError = true;return false;}supplyMsg(object);return true;}//最小长度验证function minLength(object,textlength,msg){checkInit(object);var len=0;for(var i=0;i<$(object).val().length;i++){var intCode=$(object).val().charCodeAt(i);if (intCode>=0&&intCode<=128){len=len+1;}else{len=len+3;}}if(len <textlength){$(object).next().text(msg).attr("style",errorMsgColor);haveError = true;return false;}supplyMsg(object);return true;}//是否是图片function isImage(object,msg){checkInit(object);var imageType =$(object).val().substr($(object).val().lastIndexOf('.')+1);if(imageType!=""){imageType = imageType.toLowerCase();if(imageType!='jpg' && imageType!='jpeg' && imageType!='gif' && imageType!='bmp' && imageType!='png'){$(object).next().text(msg).attr("style",errorMsgColor);haveError = true;return false;}}supplyMsg(object);return true;}//下拉列表是否选择function selectType(object,msg){basicInit(object);if($(object).children().length == 0 || $(object).val()==''){$(object).next().text(msg).attr("style",errorMsgColor);haveError = true;return false;}supplyMsg(object);return true;}//验证数字范围function checkNeedscore(object,star,end,msg){checkInit(object);if($(object).val()<star || $(object).val()>end){$(object).next().text(msg).attr('style',errorMsgColor);haveError=true;return false;}supplyMsg(object);return true;}//验证日期起始时间不大于日期结束时间function checkStartLessEndDate(startDateObj,endDateObj,msg){ if($(startDateObj).val()!='' && $(endDateObj).val()!=''){if($(startDateObj).val()>$(endDateObj).val()){$(endDateObj).next().next().next().text(msg).attr('style',errorMsgColor);haveError=true;return false;}}return true;}//****************************************************//* 提取正则表达式,所有正则表达式判断,js文件内部调用此方法* //****************************************************function regularExpression(object,msg,myReg){checkInit(object);if(!myReg.test($(object).val())){$(object).next().text(msg).attr("style",errorMsgColor);haveError = true;return false;}else{supplyMsg(object);return true;}}//必须是纯数字function isOnlyNumber(object,msg){var reg = /^[0-9]{0,}$/;return regularExpression(object,msg,reg);}//验证数字和英文function isNumOrEn(object,msg){var reg=/^[0-9A-Za-z]{0,}$/;return regularExpression(object,msg,reg);}//中间是否存在空格function nohaveSpace(object,msg,onlyName){//oblyName用于判断是否仅取出文件名称, 如果是判断一般字符串则,直接为false;var newstr;if(onlyName){ //是否只取出文件名,而忽略文件路径newstr = $(object).val().substr($(object).val().lastIndexOf('\\')+1);}else{newstr = $(object).val();}var myReg = /^\S{0,}$/;if(!myReg.test(newstr)){$(object).next().text(msg).attr("style",errorMsgColor);haveError = true;return false;}else{supplyMsg(object);return true;}}//邮箱验证function isEmail(object,msg){var myReg =/^.+\@(\[?)[a-zA-Z0-9\-\.]+\.([a-zA-Z]{2,3}|[0-9]{1,3})(\]?)$/;return regularExpression(object,msg,myReg);}//身份证验证function isIDCard(object,msg){checkInit(object);var myReg =/^(\d{6})()?(\d{2})(\d{2})(\d{2})(\d{3})$/;if($(object).val().length==18){myReg=/^((11|12|13|14|15|21|22|23|31|32|33|34|35|36|37|41|42|43|44|45|46|50|51|52|53|54|61| 62|63|64|65|71|81|82|91)\d{4})((((19|20)(([02468][048])|([13579][26]))0229))|((20[0-9][0-9])|(19[0-9][0-9]))((((0[1-9])|(1[0-2]))((0[1-9])|(1\d)|(2[0-8])))|((((0[1,3-9])|(1[0-2]))(29|30))|(((0[13578])|(1[02]))31))))((\d{3}(x|X))|(\d{4}))$/;}return regularExpression(object,msg,myReg);}//校验密码:只能输入6-20个字母、数字、下划线function isPassword(object,msg){var myReg=/^(\w){6,20}$/;return regularExpression(object,msg,myReg);}//校验普通电话、传真号码:可以“+”开头,除数字外,可含有“-”function isTeleNum(object,msg){var myReg =/^((\(\d{3}\))|(\d{3}\-))?(\(0\d{2,3}\)|0\d{2,3}-)?[1-9]\d{6,7}$/;return regularExpression(object,msg,myReg);}//********************//多行文本框不删除左右空格, 但判断只有空格的情况//********************//多行文本框初始化方法function textareaInit(object){basicInit(object);}//多行文本框非空function textareaRequired(object,msg){textareaInit(object);var colneObject = jQuery.trim($(object).val());if(colneObject.length==0){$(object).next().text(msg).attr("style",errorMsgColor);haveError = true;return false;}supplyMsg(object);return true;}//多行文本框最大长度function textareaMaxLength(object,textlength,msg){ textareaInit(object);var len=0;for(var i=0;i<$(object).val().length;i++){var intCode=$(object).val().charCodeAt(i);if (intCode>=0&&intCode<=128){len=len+1;}else{len=len+3;}}if(len >textlength){$(object).next().text(msg).attr("style",errorMsgColor);haveError = true;return false;}supplyMsg(object);return true;}//多行文本框最小长度function textareaMinLength(object,textlength,msg){var len=0;for(var i=0;i<$(object).val().length;i++){var intCode=$(object).val().charCodeAt(i);if (intCode>=0&&intCode<=128){len=len+1;}else{len=len+3;}}if(len <textlength){$(object).next().text(msg).attr("style",errorMsgColor);haveError = true;return false;}supplyMsg(object);return true;}----------------------------------------------------------------------------------------------------------------------------此验证js,是在jquery 的基础上编写的,需要先引用jquery文件.可验证对象:单行文本框,多行文本框,下拉列表可实现的验证内容:(单行文本框,多行文本框)非空,最大长度,最小长度, 数字范围,纯数字,数字和英文,中间存在空格,邮箱,身份证,校验密码.下拉列表是否选定.通过验证后,可以恢复默认提示语.用法:引用jquery 文件.1导入js文件,注意导入路径例如://<script type="text/javascript"src="<%=request.getContextPath() %>/js/crlCheckCommons.js "></script>2在需要验证控件后面添加提示语标签,并给标签指定style来指定提示语的颜色(标签必须有可以是<span> 或<div>,提示语可以为空),例如:<form id="form" name="form"action="<%=request.getContextPath()%>/appportal/app_addApp.action"method="post"><input type='text' id="username" name="username" /><span style="color:#888">姓名为必填项</span><input type='text' id="password" name="password" /><span style="color:#888">密码为必填项/span><input type="button" id="mySubmit" /></form>3.写js代码在鼠标离开文本框时验证<script type="text/javascript">$(function(){$("#username").blur(function(){if(required($(this),'姓名不能为空') && minLength($(this),4,'姓名最小长度为4') && maxLength($(this),60,'姓名最大长度为60'));});});$(function(){$("#password").blur(function(){if(required($(this),'密码此项不能为空') && minLength($(this),4,'密码最小长度为4') && maxLength($(this),60,'密码最大长度为60'));});});$(function(){$("#mySubmit").click(function(){haveError = false; //全局错误信息变量, 如果有错误,变量值会变成ture ,再验证完所有之后再判断,是否要提交表单$("#username").blur();$("#password").blur();if(!haveError){$("#form").submit();}});});</script>要注意的:如果后面有默认提示信息,则必须给该<span> 或<div> 加颜色样式,并设置变量firstMsgColor = "color:颜色"; 此变量控制验证成功后补写提示语的样式颜色.。