您的位置:首页 > Web前端 > JavaScript

JavaScript通用表单验证函数

2006-04-01 16:54 956 查看
表单定义:


<form name="form1" action="" style="behavior:url('form.htc')"></form>


客户端表单验证是由表单的onSubmit事件触发,由于表单的onSubmit事件只能由提交按钮触发,


所以如果要用函数提交表单form1.submit(),则必须同时执行form1.onSubmit()。




类型定义:




一、整型(int)


定义:


valueType="int"


属性:


objName 对象名称(字符串)


mustInput 必输项(true/false)


minInput 最小值(数字)


maxInput 最大值(数字)


举例:


<input type="text" name="test" valueType="int" objName="总载重吨" mustInput="true" maxInput="10000">




二、浮点型(float)


定义:


valueType="float"


属性:


objName 对象名称(字符串)


mustInput 必输项(true/false)


minInput 最小值(数字)


maxInput 最大值(数字)


decimalLen小数位数(数字)


举例:


<input type="text" name="test" valueType="float" objName="运价" mustInput="true" maxInput="10000.50" decimalLen="2">




三、字符串(string)


定义:


valueType="string"


属性:


objName 对象名称(字符串)


mustInput 必输项(true/false)


stringLen 字符串长度(数字)


举例:


<input type="text" name="test" valueType="string" objName="英文船名" mustInput="true" stringLen="100">




四、日期(date)


定义:


valueType="date"


属性:


objName 对象名称(字符串)


mustInput 必输项(true/false)


举例:


<input type="text" name="test" valueType="date" objName="开始日期" mustInput="true">


备注:


日期现在只能校验的格式为(yyyy-mm-dd)




五、邮箱(email)


定义:


valueType="email"


属性:


objName 对象名称(字符串)


mustInput 必输项(true/false)


举例:


<input type="text" name="test" valueType="email" objName="邮箱" mustInput="true">




六、单选(radio)


定义:


valueType="radio"


属性:


objName 对象名称(字符串)


mustSelect 必输项(true/false)


举例:


<input type="radio" name="test" valueType="radio" objName="租船方式" mustSelect="true">


备注:


对于同一组单选按钮,只需要定义第一个即可。




七、复选(checkbox)


定义:


valueType="checkbox"


属性:


objName 对象名称(字符串)


minSelect 最小选择数(数字)


maxSelect 最大选择数(数字)


举例:


<input type="checkbox" name="test" valueType="checkbox" objName="爱好" minSelect="2" maxSelect="5">


备注:


对于同一组复选按钮,只需要定义第一个即可。




八、下拉列表框(select)


定义:


valueType="select"


属性:


objName 对象名称(字符串)


mustSelect 必输项(true/false)


举例:


<select name="test" valueType="select" objName="租船方式" mustSelect="true">




九、列表框(list)


定义:


valueType="list"


属性:


objName 对象名称(字符串)


minSelect 最小选择数(数字)


maxSelect 最大选择数(数字)


举例:


<select name="test" valueType="list" objName="爱好" minSelect="2" maxSelect="5">






/////////////////////////////////////////////////////////////////////////////////////////////////////////




<!-- ---------------------------------------------------------------------


//


// File: form.htc


// version: 1.0


// Description:客户端表单验证.


// author: 伍子


//


//-------------------------------------------------------------------- -->


<PUBLIC:COMPONENT id="formCheck" urn="wwb:formCheck">


<PUBLIC:ATTACH EVENT="onsubmit" ONEVENT="checkForm()"/>


<script language="JavaScript">


function checkForm()






{


var oForm=event.srcElement;


var eles = oForm.elements;


//遍历所有表元素


for(var i=0;i<eles.length;i++)






{


//是否需要验证


var sType=eles[i].valueType;


if(sType)






{


if(eles[i].mustInput!=null && eles[i].mustInput)






{


if(trim(eles[i].value)=="")






{


if(eles[i].objName!=null)






{


alert(eles[i].objName+"不可以为空");


}


else






{


alert("该文本框为必输字段");


}


eles[i].focus();


event.returnValue=false;


return false;


}


}


switch(sType)






{


//整数


case "int":


if(!checkInt(eles[i]))






{


event.returnValue=false;


return false;


}


break;


//小数


case "float":


if(!checkFloat(eles[i]))






{


event.returnValue=false;


return false;


}


break;


//字符串


case "string":


if(!checkString(eles[i]))






{


event.returnValue=false;


return false;


}


break;


//日期


case "date":


if(!checkDate(eles[i]))






{


event.returnValue=false;


return false;


}


break;


//邮件


case "email":


if(!checkEmail(eles[i]))






{


event.returnValue=false;


return false;


}


break;


//单选按钮


case "radio":


if(!checkRadio(eles[i]))






{


event.returnValue=false;


return false;


}


break;


//复选按钮


case "checkbox":


if(!checkBox(eles[i]))






{


event.returnValue=false;


return false;


}


break;


//下拉列表框


case "select":


if(!checkSelect(eles[i]))






{


event.returnValue=false;


return false;


}


break;


//列表框


case "list":


if(!checkList(eles[i]))






{


event.returnValue=false;


return false;


}


break;


}


}


}


event.returnValue=true;


return true;


}






/**//***检查是否为整数***/


function checkInt(ele)






{


if(!isInt(ele.value))






{


alert("请输入有效整数");


ele.focus();


return false;


}


else






{


if(ele.maxInput!=null && !isNaN(ele.maxInput))


if(parseInt(ele.maxInput)<parseInt(ele.value))






{


alert("您输入的"+ convertNullToSpace(ele.objName)+"值应该小于"+ele.maxInput);


ele.focus();


return false;


}


if(ele.minInput!=null && !isNaN(ele.minInput))


if(parseInt(ele.minInput)>parseInt(ele.value))






{


alert("您输入的"+ convertNullToSpace(ele.objName)+"值应该大于"+ele.minInput);


ele.focus();


return false;


}


}


return true;


}






/**//***检查是否为小数***/


function checkFloat(ele)






{


if(isNaN(ele.value))






{


alert("请输入有效数字");


ele.focus();


return false;


}


else






{


if(ele.decimalLen!=null && !checkDecimal(ele.value,ele.decimalLen))






{


alert("您输入的"+convertNullToSpace(ele.objName)+"值小数位最多为"+ele.decimalLen);


ele.focus();


return false;


}


if(ele.maxInput!=null && !isNaN(ele.maxInput))


if(parseInt(ele.maxInput)<parseInt(ele.value))






{


alert("您输入的"+ convertNullToSpace(ele.objName)+"值应该小于"+ele.maxInput);


ele.focus();


return false;


}


if(ele.minInput!=null && !isNaN(ele.minInput))


if(parseInt(ele.minInput)>parseInt(ele.value))






{


alert("您输入的"+ convertNullToSpace(ele.objName)+"值应该大于"+ele.minInput);


ele.focus();


return false;


}


}


return true;


}






/**//***检查是否为字符串***/


function checkString(ele)






{


if(ele.stringLen!=null && !isNaN(ele.stringLen))






{


var value=new String(ele.value);


if(value.length>parseInt(ele.stringLen))






{


alert("您输入的"+convertNullToSpace(ele.objName)+"最大长度为"+ele.stringLen);


ele.focus();


return false;


}


}


return true;


}




/**//***检查是否为日期格式***/


function checkDate(ele)






{


if(!isDate(ele.value))






{


alert("请输入有效日期(yyyy-mm-dd)");


ele.focus();


return false;


}


return true;


}






/**//***检查是否为电子邮箱***/


function checkEmail(ele)






{


if(!isEmail(ele.value))






{


alert("请输入有效邮箱");


ele.focus();


return false;


}


return true;


}




/**//***检查单选按钮是否需要选择***/


function checkRadio(ele)






{


//var rads = document.getElementsByName(ele.name);


eval("var rads="+name+"."+ele.name);


var selectCount=0;


for(var i=0;i<rads.length;i++)






{


if(rads[i].checked)






{


selectCount++;


}


}




if(ele.mustSelect!=null && ele.mustSelect)






{


if(selectCount==0)






{


alert("请选择"+convertNullToSpace(ele.objName));


ele.focus();


return false;


}


}


return true;


}




/**//***检查复选按钮是否需要选择***/


function checkBox(ele)






{


//var rads = document.getElementsByName(ele.name);


eval("var chks="+name+"."+ele.name);


var selectCount=0;


for(var i=0;i<chks.length;i++)






{


if(chks[i].checked)






{


selectCount++;


}


}


if(ele.minSelect!=null && !isNaN(ele.minSelect))






{


if(selectCount<parseInt(ele.minSelect))






{


alert(convertNullToSpace(ele.objName)+"至少选择"+ele.minSelect+"项");


ele.focus();


return false;


}


}


if(ele.maxSelect!=null && !isNaN(ele.maxSelect))






{


if(selectCount>parseInt(ele.maxSelect))






{


alert(convertNullToSpace(ele.objName)+"至多选择"+ele.maxSelect+"项");


ele.focus();


return false;


}


}


return true;


}




/**//***检查下拉列表框是否需要选择***/


function checkSelect(ele)






{


//var rads = document.getElementsByName(ele.name);


if(ele.mustSelect!=null && ele.mustSelect)






{


if(ele.selectedIndex==0)






{


alert("请选择"+convertNullToSpace(ele.objName));


ele.focus();


return false;


}


}


return true;


}




/**//***检查列表框的选择项数***/


function checkList(ele)






{


//var rads = document.getElementsByName(ele.name);


var selectCount=0;


for(var i=0;i<ele.options.length;i++)






{


if(ele.options[i].selected)






{


selectCount++;


}


}


alert(selectCount);


if(ele.minSelect!=null && !isNaN(ele.minSelect))






{


if(selectCount<parseInt(ele.minSelect))






{


alert(convertNullToSpace(ele.objName)+"至少选择"+ele.minSelect+"项");


ele.focus();


return false;


}


}


if(ele.maxSelect!=null && !isNaN(ele.maxSelect))






{


if(selectCount>parseInt(ele.maxSelect))






{


alert(convertNullToSpace(ele.objName)+"至多选择"+ele.maxSelect+"项");


ele.focus();


return false;


}


}


return true;


}




/**//***判断是否为整数***/


function isInt(s)






{




var patrn=/^[-,+]

{0,1}[0-9]

{0,}$/;


if (!patrn.exec(s))


return false;


return true;


}




/**//***判断是否为数字***/


function isNumber(s)






{




var patrn=/^[-,+]

{0,1}[0-9]

{0,}[.]

{0,1}[0-9]

{0,}$/;


if (!patrn.exec(s))


return false;


return true;


}




/**//***判断是否为日期***/


function isDate(str)






{




var r = str.match(/^(/d

{1,4})(-|//)(/d

{1,2})/2(/d

{1,2})$/);


if(r==null)






{


return false;


}


var d= new Date(r[1], r[3]-1, r[4]);


if(!(d.getFullYear()==r[1]&&(d.getMonth()+1)==r[3]&&d.getDate()==r[4]))






{


return false;


}


return true;


}




/**//***判断是否为邮箱***/


function isEmail(str)






{




if(str.match(/[/w-]+@

{1}[/w-]+/.

{1}/w

{2,4}(/.

{0,1}/w

{2})

{0,1}/ig)!=str)


return false;


else


return true;


}




/**//***将NULL转化为空格,用于显示对象名称***/


function convertNullToSpace(paramValue)






{


if(paramValue==null)


return "";


else


return paramValue;


}




/**//***检查小数位数***/


function checkDecimal(num,decimalLen)






{


var len = decimalLen*1+1;


if(num.indexOf('.')>0)






{


num=num.substr(num.indexOf('.')+1,num.length-1);


if ((num.length)<len)






{


return true;


}


else






{


return false;


}


}


return true;


}




/**//***去除空格***/


function trim(str)






{


if (str.length > 0)






{


while ((str.substring(0,1) == " ") && (str.length > 0))






{


str = str.substring(1,str.length);


}


while (str.substring(str.length-1,str.length) == " ")






{


str = str.substring(0,str.length-1);


}


}


return str;


}


</script>


</PUBLIC:COMPONENT>

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: