作者:罗代均,ldj_work#126.com, 转载请保持完整性
1.先看看使用的例子
先看看使用的例子,方便再往下看,以免耽误大家时间
ok, 假设有如下测试html页面
===================================================================
<html>
<title>测试</title>
<head>
<script language="javascript" src="common.js"></script>
<script language="javascript">
function checkForm(){
if(checkField("username","用户名",10)==false
||checkFieldEmail("email","E-Mail")==false
||checkFieldDate("borthday","生日")==false
||checkFieldFloat("money","金额",10,2)==false){
return false;
}
return true;
}
</script>
</head>
<body>
<form οnsubmit="return checkForm()">
用户名:<input name="username" type="text" /><br/>
E-Mail:<input name="email" type="text" /><br/>
生日:<input name="borthday" type="text" /><br/>
金额:<input name="money" type="text" /><br/>
<input type="submit" value="提交">
</form>
</body>
</html>
======================================================================
2,common.js函数库
/*==========================================================================================
函数功能: 检查文本框是否为空,以及是否超过字数限制
field:文本框 name 名称
fiedlDesc:文本框描述
length:最大长度
使用方法:checkField("userName","用户名",8),用户名不能为空,并且小于8个字符
==============================================================================================*/
function checkField(field,fieldDesc,length){
var obj=document.getElementsByName(field)[0];
if(obj==null){
return true;
}else if(obj.value.length==0){
alert("请输入"+fieldDesc);
obj.focus();
return false;
}else if(obj.value.length>length){
alert(fieldDesc+"的长度不能超过"+length+"个字符");
obj.focus();
return false;
}
return true;
}
/*==========================================================================================
函数功能: 检查文本框是否为空,以及是是否满足整数部分及小数部分长度限制
field:文本框 name 名称
fiedlDesc:文本框描述
lengthZ:整数部分最大长度
lengthF:小数部分最大长度
使用方法如下:checkFieldFloat("money","金额",8,2)
==============================================================================================*/
function checkFieldFloat(field,fieldDesc,lengthZ,lengthF){
var obj=document.getElementsByName(field)[0];
if(obj==null){
return true;
}else if(obj.value.length==0){
alert("请输入"+fieldDesc);
obj.focus();
return false;
}else if(obj.value.indexOf(".")==-1){
if(obj.value.length>lengthZ){
alert(fieldDesc+"整数部分不得超过"+lengthZ+"位");
obj.focus();
return false;
}else if(!/^(/d{1,10})$/.test(obj.value)){
alert(fieldDesc+"请输入数字.");
obj.focus();
return false;
}
}else if(!/^(/d{1,10})(/./d{1,2})$/.test(obj.value)){
alert(fieldDesc+"整数部分不得超过"+lengthZ+"位,小数部分不得超过"+lengthF+"位");
obj.focus();
return false;
}
return true;
}
/*==============================================================================================
函数功能:是否日期,如2006-12-05
field:文本框 name 名称
field:文本框描述
使用方法: checkFieldDate("inDate","申请时间")
===============================================================================================*/
function checkFieldDate(field,fieldDesc){
var obj=document.getElementsByName(field)[0];
if(obj==null){
return true;
}
if(obj.value.length==0){
alert("请输入"+fieldDesc);
obj.focus();
return false;
}
var r = obj.value.match(/^(/d{1,4})(-|//)(/d{1,2})/2(/d{1,2})$/);
if(r==null){
alert(fieldDesc+"格式不正确,正确格式为:2006-12-05");
obj.focus();
return false;
}
var falg=false;
var d= new Date(r[1], r[3]-1, r[4]);
flag = d.getFullYear()==r[1]&&(d.getMonth()+1)==r[3]&&d.getDate()==r[4];
if(!flag){
alert(fieldDesc+"格式不正确,正确格式为:2006-12-05");
obj.focus();
}
return flag;
}
//是否日期时间,如2006-12-05 17:45:03
function checkFieldDateTime(field,fieldDesc){
var obj=document.getElementsByName(field)[0];
if(obj==null){
return true;
}
if(obj.value.length==0){
alert("请输入"+fieldDesc);
obj.focus();
return false;
}
var reg = /^(/d{1,4})(-|//)(/d{1,2})/2(/d{1,2}) (/d{1,2}):(/d{1,2}):(/d{1,2})$/;
var r = obj.value.match(reg);
if(r==null){
alert(fieldDesc+"格式不正确,正确格式为:2006-12-05 08:10:05");
obj.focus();
return false;
}
var flag=false;
var d= new Date(r[1], r[3]-1,r[4],r[5],r[6],r[7]);
flag = d.getFullYear()==r[1]&&(d.getMonth()+1)==r[3]&&d.getDate()==r[4]&&d.getHours()==r[5]&&d.getMinutes()==r[6]&&d.getSeconds()== r[7];
if(!flag){
alert("日期格式不正确,正确格式为:2006-12-05 08:10:05");
obj.focus();
}
return flag;
}
/*==============================================================================================
函数功能:是否Email
field:文本框 name 名称
===============================================================================================*/
function checkFieldEmail(field,fieldDesc){
var obj=document.getElementsByName(field)[0];
if(obj==null){
return true;
}
if(obj.value.length==0){
alert("请输入"+fieldDesc);
obj.focus();
return false;
}
if(!new RegExp(/^/w+((-/w+)|(/./w+))*/@[A-Za-z0-9]+((/.|-)[A-Za-z0-9]+)*/.[A-Za-z0-9]+$/).test(obj.value)){
alert(fieldDesc+"格式不正确.");
obj.focus();
return false;
}
return true;
}
/*==============================================================================================
函数功能:checkBox全选/全不选
fieldName:checkBox 名称 name
使用方法: checkbox: <input type="checkbox" name="empid"/>
checkAll('empid')
===============================================================================================*/
function checkAll(fieldName) {
var a = document.getElementsByName(fieldName);
var n = a.length;
for (var i=0; i<n; i++){
a[i].checked = !a[i].checked;
}
}
//关闭窗口
function closeWindow(){
var ua = navigator.userAgent;
var ie = navigator.appName=="Microsoft Internet Explorer"?true:false;
if(ie){
var IEversion = parseFloat(ua.substring(ua.indexOf("MSIE ")+5,ua.indexOf(";",ua.indexOf("MSIE "))));
if( IEversion< 5.5){
var str = '';
document.body.insertAdjacentHTML("beforeEnd", str);
document.all.noTipClose.Click();
} else {
window.opener =null; window.close();
}
}else{
window.close()
}
}
/*=================================================================================================
函数功能:弹出居中窗口
url: 弹出窗口url地址
width:弹出窗口宽度
height:弹出窗口高度
isModal:是否模态窗口,true:模态
使用方法: showDialog('aaa.htm',300,400,false)
==================================================================================================*/
function showDialog(url,iHeight,iWidth,isModal){
var iTop=(window.screen.height-iHeight)/2;
var iLeft=(window.screen.width-iWidth)/2;
if(isModal){
window.showModalDialog(url,window,"dialogHeight: "+iHeight+"px; dialogWidth: "+iWidth+"px; dialogTop: "+iTop+";dialogLeft: "+iLeft+"; resizable: no; status: no;scroll:no");
}else{
window.open(url,"","Scrollbars=no,Toolbar=no,Location=no,Direction=no,Resizeable=no, Width="+iWidth+",Height="+iHeight+",top="+iTop+",left="+iLeft);
}
}