在b/s开发中经常用到的javaScript技术

时间:2021-05-25

一、验证类
1、数字验证内
1.1整数
1.2大于0的整数(用于传来的ID的验证)
1.3负整数的验证
1.4整数不能大于iMax
1.5整数不能小于iMin
2、时间类
2.1短时间,形如(13:04:06)
2.2短日期,形如(2003-12-05)
2.3长时间,形如(2003-12-0513:04:06)
2.4只有年和月。形如(2003-05,或者2003-5)
2.5只有小时和分钟,形如(12:03)
3、表单类
3.1所有的表单的值都不能为空
3.2多行文本框的值不能为空。
3.3多行文本框的值不能超过sMaxStrleng
3.4多行文本框的值不能少于sMixStrleng
3.5判断单选框是否选择。
3.6判断复选框是否选择.
3.7复选框的全选,多选,全不选,反选
3.8文件上传过程中判断文件类型
4、字符类
4.1判断字符全部由a-Z或者是A-Z的字字母组成
4.2判断字符由字母和数字组成。
4.3判断字符由字母和数字,下划线,点号组成.且开头的只能是下划线和字母
4.4字符串替换函数.Replace();
5、浏览器类
5.1判断浏览器的类型
5.2判断ie的版本
5.3判断客户端的分辨率

6、结合类
6.1email的判断。
6.2手机号码的验证
6.3身份证的验证


二、功能类

1、时间与相关控件类
1.1日历
1.2时间控件
1.3万年历
1.4显示动态显示时钟效果(文本,如OA中时间)
1.5显示动态显示时钟效果(图像,像手表)
2、表单类
2.1自动生成表单
2.2动态添加,修改,删除下拉框中的元素
2.3可以输入内容的下拉框
2.4多行文本框中只能输入iMax文字。如果多输入了,自动减少到iMax个文字(多用于短信发送)

3、打印类
3.1打印控件
4、事件类
4.1屏蔽右键
4.2屏蔽所有功能键
4.3-->和<--F5F11,F9,F1
4.4屏蔽组合键ctrl+N
5、网页设计类
5.1连续滚动的文字,图片(注意是连续的,两段文字和图片中没有空白出现)
5.2html编辑控件类
5.3颜色选取框控件
5.4下拉菜单
5.5两层或多层次的下拉菜单
5.6仿IE菜单的按钮。(效果如rongshuxa.com的导航栏目)
5.7状态栏,title栏的动态效果(例子很多,可以研究一下)
5.8双击后,网页自动滚屏
6、树型结构。
6.1asp+SQL版
6.2asp+xml+sql版
6.3java+sql或者java+sql+xml
7、无边框效果的制作
8、连动下拉框技术
9、文本排序


一、验证类
1、数字验证内
1.1整数
/^(-|\+)?\d+$/.test(str)
1.2大于0的整数(用于传来的ID的验证)
/^\d+$/.test(str)
1.3负整数的验证
/^-\d+$/.test(str)
2、时间类
2.1短时间,形如(13:04:06)
functionisTime(str)
{
vara=str.match(/^(\d{1,2})(:)?(\d{1,2})\2(\d{1,2})$/);
if(a==null){alert('输入的参数不是时间格式');returnfalse;}
if(a[1]>24||a[3]>60||a[4]>60)
{
alert("时间格式不对");
returnfalse
}
returntrue;
}
2.2短日期,形如(2003-12-05)
functionstrDateTime(str)
{
varr=str.match(/^(\d{1,4})(-|\/)(\d{1,2})\2(\d{1,2})$/);
if(r==null)returnfalse;
vard=newDate(r[1],r[3]-1,r[4]);
return(d.getFullYear()==r[1]&&(d.getMonth()+1)==r[3]&&d.getDate()==r[4]);
}
2.3长时间,形如(2003-12-0513:04:06)
functionstrDateTime(str)
{
varreg=/^(\d{1,4})(-|\/)(\d{1,2})\2(\d{1,2})(\d{1,2}):(\d{1,2}):(\d{1,2})$/;
varr=str.match(reg);
if(r==null)returnfalse;
vard=newDate(r[1],r[3]-1,r[4],r[5],r[6],r[7]);
return(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]);
}
2.4只有年和月。形如(2003-05,或者2003-5)
2.5只有小时和分钟,形如(12:03)
3、表单类
3.1所有的表单的值都不能为空
<inputonblur="if(this.value.replace(/^\s+|\s+$/g,'')=='')alert('不能为空!')">
3.2多行文本框的值不能为空。
3.3多行文本框的值不能超过sMaxStrleng
3.4多行文本框的值不能少于sMixStrleng
3.5判断单选框是否选择。
3.6判断复选框是否选择.
3.7复选框的全选,多选,全不选,反选
3.8文件上传过程中判断文件类型
4、字符类
4.1判断字符全部由a-Z或者是A-Z的字字母组成
<inputonblur="if(/[^a-zA-Z]/g.test(this.value))alert('有错')">
4.2判断字符由字母和数字组成。
<inputonblur="if(/[^0-9a-zA-Z]/g.test(this.value))alert('有错')">
4.3判断字符由字母和数字,下划线,点号组成.且开头的只能是下划线和字母
/^([a-zA-z_]{1})([\w]*)$/g.test(str)
4.4字符串替换函数.Replace();
5、浏览器类
5.1判断浏览器的类型
window.navigator.appName
5.2判断ie的版本
window.navigator.appVersion
5.3判断客户端的分辨率
window.screen.height;window.screen.width;

6、结合类
6.1email的判断。
functionismail(mail)
{
return(newRegExp(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/).test(mail));
}
6.2手机号码的验证
6.3身份证的验证
functionisIdCardNo(num)
{
if(isNaN(num)){alert("输入的不是数字!");returnfalse;}
varlen=num.length,re;
if(len==15)
re=newRegExp(/^(\d{6})()?(\d{2})(\d{2})(\d{2})(\d{3})$/);
elseif(len==18)
re=newRegExp(/^(\d{6})()?(\d{4})(\d{2})(\d{2})(\d{3})(\d)$/);
else{alert("输入的数字位数不对!");returnfalse;}
vara=num.match(re);
if(a!=null)
{
if(len==15)
{
varD=newDate("19"+a[3]+"/"+a[4]+"/"+a[5]);
varB=D.getYear()==a[3]&&(D.getMonth()+1)==a[4]&&D.getDate()==a[5];
}
else
{
varD=newDate(a[3]+"/"+a[4]+"/"+a[5]);
varB=D.getFullYear()==a[3]&&(D.getMonth()+1)==a[4]&&D.getDate()==a[5];
}
if(!B){alert("输入的身份证号"+a[0]+"里出生日期不对!");returnfalse;}
}
returntrue;
}

3.7复选框的全选,多选,全不选,反选
<formname=hrong>
<inputtype=checkboxname=Allonclick="checkAll('mm')">全选<br/>
<inputtype=checkboxname=mmonclick="checkItem('All')"><br/>
<inputtype=checkboxname=mmonclick="checkItem('All')"><br/>
<inputtype=checkboxname=mmonclick="checkItem('All')"><br/>
<inputtype=checkboxname=mmonclick="checkItem('All')"><br/>
<inputtype=checkboxname=mmonclick="checkItem('All')"><br/><br/>


<inputtype=checkboxname=All2onclick="checkAll('mm2')">全选<br/>
<inputtype=checkboxname=mm2onclick="checkItem('All2')"><br/>
<inputtype=checkboxname=mm2onclick="checkItem('All2')"><br/>
<inputtype=checkboxname=mm2onclick="checkItem('All2')"><br/>
<inputtype=checkboxname=mm2onclick="checkItem('All2')"><br/>
<inputtype=checkboxname=mm2onclick="checkItem('All2')"><br/>

</form>

<SCRIPTLANGUAGE="javascript">
functioncheckAll(str)
{
vara=document.getElementsByName(str);
varn=a.length;
for(vari=0;i<n;i++)
a[i].checked=window.event.srcElement.checked;
}
functioncheckItem(str)
{
vare=window.event.srcElement;
varall=eval("document.hrong."+str);
if(e.checked)
{
vara=document.getElementsByName(e.name);
all.checked=true;
for(vari=0;i<a.length;i++)
{
if(!a[i].checked){all.checked=false;break;}
}
}
elseall.checked=false;
}
</SCRIPT>

3.8文件上传过程中判断文件类型
<inputtype=fileonchange="alert(this.value.match(/^(.*)(\.)(.{1,8})$/)[3])">

画图:
<OBJECT
id=S
style="LEFT:0px;WIDTH:392px;TOP:0px;HEIGHT:240px"
height=240
width=392
classid="clsid:369303C2-D7AC-11D0-89D5-00A0C90833E6">
</OBJECT>
<SCRIPT>
S.DrawingSurface.ArcDegrees(0,0,0,30,50,60);
S.DrawingSurface.ArcRadians(30,0,0,30,50,60);
S.DrawingSurface.Line(10,10,100,100);
</SCRIPT>

写注册表:
<SCRIPT>
varWshShell=WScript.CreateObject("WScript.Shell");
WshShell.RegWrite("HKCU\\Software\\ACME\\FortuneTeller\\",1,"REG_BINARY");
WshShell.RegWrite("HKCU\\Software\\ACME\\FortuneTeller\\MindReader","Goocher!","REG_SZ");
varbKey=WshShell.RegRead("HKCU\\Software\\ACME\\FortuneTeller\\");
WScript.Echo(WshShell.RegRead("HKCU\\Software\\ACME\\FortuneTeller\\MindReader"));
WshShell.RegDelete("HKCU\\Software\\ACME\\FortuneTeller\\MindReader");
WshShell.RegDelete("HKCU\\Software\\ACME\\FortuneTeller\\");
WshShell.RegDelete("HKCU\\Software\\ACME\\");
</SCRIPT>

TABLAE相关(客户端动态增加行列)
<HTML>
<SCRIPTLANGUAGE="JScript">
functionnumberCells(){
varcount=0;
for(i=0;i<document.all.mytable.rows.length;i++){
for(j=0;j<document.all.mytable.rows(i).cells.length;j++){
document.all.mytable.rows(i).cells(j).innerText=count;
count++;
}
}
}
</SCRIPT>
<BODYonload="numberCells()">
<TABLEid=mytableborder=1>
<TR><TH></TH><TH></TH><TH></TH><TH></TH></TR>
<TR><TD></TD><TD></TD><TD></TD><TD></TD></TR>
<TR><TD></TD><TD></TD><TD></TD><TD></TD></TR>
</TABLE>
</BODY>
</HTML>

1.身份证严格验证:

<script>
varaCity={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:"国外"}

functioncidInfo(sId){
variSum=0
varinfo=""
if(!/^\d{17}(\d|x)$/i.test(sId))returnfalse;
sId=sId.replace(/x$/i,"a");
if(aCity[parseInt(sId.substr(0,2))]==null)return"Error:非法地区";
sBirthday=sId.substr(6,4)+"-"+Number(sId.substr(10,2))+"-"+Number(sId.substr(12,2));
vard=newDate(sBirthday.replace(/-/g,"/"))
if(sBirthday!=(d.getFullYear()+"-"+(d.getMonth()+1)+"-"+d.getDate()))return"Error:非法生日";
for(vari=17;i>=0;i--)iSum+=(Math.pow(2,i)%11)*parseInt(sId.charAt(17-i),11)
if(iSum%11!=1)return"Error:非法证号";
returnaCity[parseInt(sId.substr(0,2))]+","+sBirthday+","+(sId.substr(16,1)%2?"男":"女")
}

document.write(cidInfo("380524198002300016"),"<br/>");
document.write(cidInfo("340524198002300019"),"<br/>")
document.write(cidInfo("340524197711111111"),"<br/>")
document.write(cidInfo("34052419800101001x"),"<br/>");
</script>

2.验证IP地址
<SCRIPTLANGUAGE="javascript">
functionisip(s){
varcheck=function(v){try{return(v<=255&&v>=0)}catch(x){returnfalse}};
varre=s.split(".")
return(re.length==4)?(check(re[0])&&check(re[1])&&check(re[2])&&check(re[3])):false
}

vars="202.197.78.129";
alert(isip(s))
</SCRIPT>



3.加sp1后还能用的无边框窗口!!
<HTMLXMLNS:IE>
<metahttp-equiv="Content-Type"content="text/html;charset=gb2312">
<IE:DownloadID="include"STYLE="behavior:url(#default#download)"/>
<title>ChromelessWindow</title>

<SCRIPTLANGUAGE="JScript">






varCW_width=400;
varCW_height=300;
varCW_top=100;
varCW_left=100;
varCW_url="/";
varNew_CW=window.createPopup();
varCW_Body=New_CW.document.body;
varcontent="";
varCSStext="margin:1px;color:black;border:2pxoutset;border-style:expression(onmouseout=onmouseup=function(){this.style.borderStyle='outset'},onmousedown=function(){if(event.button!=2)this.style.borderStyle='inset'});background-color:buttonface;width:16px;height:14px;font-size:12px;line-height:11px;cursor:Default;";

//BuildWindow
include.startDownload(CW_url,function(source){content=source});

functioninsert_content(){
vartemp="";
CW_Body.style.overflow="hidden";
CW_Body.style.backgroundColor="white";
CW_Body.style.border="solidblack1px";
content=content.replace(/<a([^>]*)>/g,"<aonclick='parent.open(this.href);returnfalse'$1>");
temp+="<tablewidth=100%height=100%cellpadding=0cellspacing=0border=0>";
temp+="<trstyle=';font-size:12px;background:#0099CC;height:20;cursor:default'ondblclick=\"Max.innerText=Max.innerText=='1'?'2':'1';parent.if_max=!parent.if_max;parent.show_CW();\"onmouseup='parent.drag_up(event)'onmousemove='parent.drag_move(event)'onmousedown='parent.drag_down(event)'onselectstart='returnfalse'oncontextmenu='returnfalse'>";
temp+="<tdstyle='color:#ffffff;padding-left:5px'>ChromelessWindowForIE6SP1</td>";
temp+="<tdstyle='color:#ffffff;padding-right:5px;'align=right>";
temp+="<spanid=Helponclick=\"alert('ChromelessWindowForIE6SP1-Ver1.0\\n\\nCodeByWindy_sk\\n\\nSpecialThanksForandot')\"style=\""+CSStext+"font-family:System;padding-right:2px;\">?</span>";
temp+="<spanid=Minonclick='parent.New_CW.hide();parent.blur()'style=\""+CSStext+"font-family:Webdings;\"title='Minimum'>0</span>";
temp+="<spanid=Maxonclick=\"this.innerText=this.innerText=='1'?'2':'1';parent.if_max=!parent.if_max;parent.show_CW();\"style=\""+CSStext+"font-family:Webdings;\"title='Maximum'>1</span>";
temp+="<spanid=Closeonclick='parent.opener=null;parent.close()'style=\""+CSStext+"font-family:System;padding-right:2px;\"title='Close'>x</span>";
temp+="</td></tr><tr><tdcolspan=2>";
temp+="<divid=includestyle='overflow:scroll;overflow-x:hidden;overflow-y:auto;HEIGHT:100%;width:"+CW_width+"'>";
temp+=content;
temp+="</div>";
temp+="</td></tr></table>";
CW_Body.innerHTML=temp;
}

setTimeout("insert_content()",1000);

varif_max=true;
functionshow_CW(){
window.moveTo(10000,10000);
if(if_max){
New_CW.show(CW_top,CW_left,CW_width,CW_height);
if(typeof(New_CW.document.all.include)!="undefined"){
New_CW.document.all.include.style.width=CW_width;
New_CW.document.all.Max.innerText="1";
}

}else{
New_CW.show(0,0,screen.width,screen.height);
New_CW.document.all.include.style.width=screen.width;
}
}

window.onfocus=show_CW;
window.onresize=show_CW;

//MoveWindow
vardrag_x,drag_y,draging=false

functiondrag_move(e){
if(draging){
New_CW.show(e.screenX-drag_x,e.screenY-drag_y,CW_width,CW_height);
returnfalse;
}
}

functiondrag_down(e){
if(e.button==2)return;
if(New_CW.document.body.offsetWidth==screen.width&&New_CW.document.body.offsetHeight==screen.height)return;
drag_x=e.clientX;
drag_y=e.clientY;
draging=true;
e.srcElement.setCapture();
}

functiondrag_up(e){
draging=false;
e.srcElement.releaseCapture();
if(New_CW.document.body.offsetWidth==screen.width&&New_CW.document.body.offsetHeight==screen.height)return;
CW_top=e.screenX-drag_x;
CW_left=e.screenY-drag_y;
}

</SCRIPT>
</HTML>

电话号码的验证

要求:
  (1)电话号码由数字、"("、")"和"-"构成
  (2)电话号码为3到8位
  (3)如果电话号码中包含有区号,那么区号为三位或四位
  (4)区号用"("、")"或"-"和其他部分隔开
  (5)移动电话号码为11或12位,如果为12位,那么第一位为0
  (6)11位移动电话号码的第一位和第二位为"13"
  (7)12位移动电话号码的第二位和第三位为"13"
  根据这几条规则,可以与出以下正则表达式:
  (^[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}$)


<scriptlanguage="javascript">
functionPhoneCheck(s){
varstr=s;
varreg=/(^[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}$)/
alert(reg.test(str));
}
</script>
<inputtype=textname="iphone">
<inputtype=buttononclick="PhoneCheck(document.all.iphone.value)"value="Check">

具有在输入非数字字符不回显的效果,即对非数字字符的输入不作反应。
functionnumbersonly(field,event){
varkey,keychar;
if(window.event){
key=window.event.keyCode;
}
elseif(event){
key=event.which;
}
else{
returntrue
}
keychar=String.fromCharCode(key);
if((key==null)||(key==0)||(key==8)||(key==9)||(key==13)||(key==27)){
returntrue;
}
elseif(("0123456789.").indexOf(keychar)>-1){
window.status="";
returntrue;
}
else{
window.status="Fieldexceptsnumbersonly";
returnfalse;
}
}

验证ip

str=document.RegExpDemo.txtIP.value;
if(/^(\d{1,3})\.(\d{1,3})\.(\d{1,3})\.(\d{1,3})$/.test(str)==false)
{
window.alert('错误的IP地址格式');
document.RegExpDemo.txtIP.select();
document.RegExpDemo.txtIP.focus();
return;
}
if(RegExp.$1<1||RegExp.$1>254||RegExp.$2<0||RegExp.$2>254||RegExp.$3<0||RegExp.$3>254||RegExp.$4<1||RegExp.$4>254)
{
window.alert('错误的IP地址');
document.RegExpDemo.txtIP.select();
document.RegExpDemo.txtIP.focus();
return;
}
//剔除如010.020.020.03前面的0
varstr=str.replace(/0(\d)/g,"$1");
str=str.replace(/0(\d)/g,"$1");
window.alert(str);

声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。

相关文章