BS开发中常用的Javascript技?nbsp;
一、验证类
1、数字验证内
1.1 整数
1.2 大于0的整?nbsp;Q用于传来的ID的验?
1.3 负整数的验证
1.4 整数不能大于iMax
1.5 整数不能于iMin
2、时间类
2.1 短时_形如 (13:04:06)
2.2 短日期，形如 (2003-12-05)
2.3 长时_形如 (2003-12-05 13:04:06)
2.4 只有q和月。Ş?2003-05,或?003-5)
2.5 只有时和分?形如(12:03)
3、表单类
3.1 所有的表单的值都不能为空
3.2 多行文本框的g能ؓI?nbsp;
3.3 多行文本框的g能超qsMaxStrleng
3.4 多行文本框的g能少于sMixStrleng
3.5 判断单选框是否选择?nbsp;
3.6 判断复选框是否选择.
3.7 复选框的全选，多选，全不选，反?nbsp;
3.8 文g上传q程中判断文件类?nbsp;
4、字W类
4.1 判断字符全部由a-Z或者是A-Z的字字母l成
4.2 判断字符由字母和数字l成?nbsp;
4.3 判断字符由字母和数字Q下划线,点号l成.且开头的只能是下划线和字?nbsp;
4.4 字符串替换函?Replace();
5、浏览器c?nbsp;
5.1 判断览器的cd
5.2 判断ie的版?nbsp;
5.3 判断客户端的分L?nbsp;
6、结合类
6.1 email的判断?nbsp;
6.2 手机L的验?nbsp;
6.3 w䆾证的验证
二、功能类
1、时间与相关控gc?nbsp;
1.1 日历
1.2 旉控g
1.3 万年?nbsp;
1.4 昄动态显C时钟效果（文本Q如OA中时_
1.5 昄动态显C时钟效?nbsp;(囑փQ像手表)
2、表单类
2.1 自动生成表单
2.2 动态添加，修改Q删除下拉框中的元素
2.3 可以输入内容的下拉框
2.4 多行文本框中只能输入iMax文字。如果多输入了，自动减少到iMax个文字（多用于短信发?
3、打印类
3.1 打印控g
4、事件类
4.1 屏蔽右键
4.2 屏蔽所有功能键
4.3 --> ?lt;-- F5 F11,F9,F1
4.4 屏蔽l合键ctrl+N
5、网设计类
5.1 q箋滚动的文字，囄Q注意是q箋的，两段文字和图片中没有I白出现Q?nbsp;
5.2 html~辑控gc?nbsp;
5.3 颜色选取框控?nbsp;
5.4 下拉菜单
5.5 两层或多层次的下拉菜?nbsp;
5.6 仿IE菜单的按钮。（效果如rongshuxa.com的导航栏?
5.7 状态栏Qtitle栏的动态效果（例子很多Q可以研I一下）
5.8 双击后，|页自动滚屏
6、树型结构?nbsp;
6.1 asp+SQL?nbsp;
6.2 asp+xml+sql?nbsp;
6.3 java+sql或者java+sql+xml
7、无Ҏ效果的制?nbsp;
8、连动下拉框技?nbsp;
9、文本排?nbsp;
10Q画囄Q含饹{柱、矢量贝滋曲U?nbsp;
11Q操U客L注册表类
12QDIV层相养I拖拽、显C、隐藏、移动、增加）
13QTABLAE相关(客户端动态增加行列，模拟q度条，滚动列表{?
14Q各U?lt;object classid=>相关c，如播攑֙Qflash与脚本互动等
16, h/模拟无刷?nbsp;异步调用c（XMLHttp或iframe,frameQ?nbsp;
<script language="JavaScript">
<!--
function check(text){
var checkstr,iMax=5,iMin=3
checkstr="isInt:"+(parseInt(text)==text)+"\n"
checkstr+="isID:"+((parseInt(text)==text)&&(text>=0))+"\n"
checkstr+="于"+iMax+":"+((parseInt(text)==text)&&(text<iMax))+"\n"
checkstr+="大于"+iMin+":"+((parseInt(text)==text)&&(text>iMin))+"\n"
alert(checkstr)
}
//-->
<form method=post action="">
<input type="text" id="text1" onchange="check(this.value)">
</form>
4、事件类
4.1 屏蔽右键
在body标签里加上oncontextmenu=self.event.returnValue=false
4.2 屏蔽所有功能键
4.3 --> ?lt;-- F5 F11,F9,F1
4.4 屏蔽l合键ctrl+N
<script language=javascript>
function KeyDown(){
if ((window.event.altKey)&&
((window.event.keyCode==37)|| //屏蔽 Alt+ 方向?nbsp;?nbsp;
(window.event.keyCode==39))){ //屏蔽 Alt+ 方向?nbsp;?nbsp;
alert("不准你用ALT+方向键前q或后退|页Q?
; event.returnValue=false;
}
if ((event.keyCode==8)|| //屏蔽退格删除键
(event.keyCode==116)){ //屏蔽 F5 h?nbsp;
event.keyCode=0;
event.returnValue=false;
}
if ((event.ctrlKey)&&(event.keyCode==78)){ //屏蔽 Ctrl+n
event.returnValue=false;
}
if ((event.shiftKey)&&(event.keyCode==121)){ //屏蔽 shift+F10
event.returnValue=false;
}
if (event.keyCode==122){ //屏蔽 F11
event.returnValue=false;
}
}
只要知道keyCode卛_屏蔽所有功能键
一、验证类
1、数字验证内
1.1 整数
/^(-|\+)?\d+Q?.test(str)
1.2 大于0的整?nbsp;Q用于传来的ID的验?
/^\d+Q?.test(str)
1.3 负整数的验证
/^-\d+Q?.test(str)
2、时间类
2.1 短时_形如 (13:04:06)
function isTime(str)
{
var a = str.match(/^(\d{1,2})(
?(\d{1,2})\2(\d{1,2})Q?); if (a == null) {alert('输入的参C是时间格?); return false;}
if (a[1]>24 || a[3]>60 || a[4]>60)
{
alert("旉格式不对"
; return false
}
return true;
}
2.2 短日期，形如 (2003-12-05)
function strDateTime(str)
{
var r = str.match(/^(\d{1,4})(-|\/)(\d{1,2})\2(\d{1,2})Q?);
if(r==null)return false;
var d= new Date(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-05 13:04:06)
function strDateTime(str)
{
var reg = /^(\d{1,4})(-|\/)(\d{1,2})\2(\d{1,2}) (\d{1,2})
\d{1,2})\d{1,2})Q?; var r = str.match(reg);
if(r==null)return false;
var d= new Date(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 只有q和月。Ş?2003-05,或?003-5)
2.5 只有时和分?形如(12:03)
3、表单类
3.1 所有的表单的值都不能为空
<input onblur="if(this.value.replace(/^\s+|\s+Q?g,')==')alert('不能为空!')">
3.2 多行文本框的g能ؓI?nbsp;
3.3 多行文本框的g能超qsMaxStrleng
3.4 多行文本框的g能少于sMixStrleng
3.5 判断单选框是否选择?nbsp;
3.6 判断复选框是否选择.
3.7 复选框的全选，多选，全不选，反?nbsp;
3.8 文g上传q程中判断文件类?nbsp;
4、字W类
4.1 判断字符全部由a-Z或者是A-Z的字字母l成
<input onblur="if(/[^a-zA-Z]/g.test(this.value))alert('有错')">
4.2 判断字符由字母和数字l成?nbsp;
<input onblur="if(/[^0-9a-zA-Z]/g.test(this.value))alert('有错')">
4.3 判断字符由字母和数字Q下划线,点号l成.且开头的只能是下划线和字?nbsp;
/^([a-zA-z_]{1})([\w]*)Q?g.test(str)
4.4 字符串替换函?Replace();
5、浏览器c?nbsp;
5.1 判断览器的cd
window.navigator.appName
5.2 判断ie的版?nbsp;
window.navigator.appVersion
5.3 判断客户端的分L?nbsp;
window.screen.height; window.screen.width;
6、结合类
6.1 email的判断?nbsp;
function ismail(mail)
{
return(new RegExp(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)
[A-Za-z0-9]+)*\.[A-Za-z0-9]+Q?).test(mail));
}
6.2 手机L的验?nbsp;
6.3 w䆾证的验证
function isIdCardNo(num)
{
if (isNaN(num)) {alert("输入的不是数字！"
; return false;} var len = num.length, re;
if (len == 15)
re = new RegExp(/^(\d{6})()?(\d{2})(\d{2})(\d{2})(\d{3})Q?);
else if (len == 18)
re = new RegExp(/^(\d{6})()?(\d{4})(\d{2})(\d{2})(\d{3})(\d)Q?);
else {alert("输入的数字位C对！"
; return false;} var a = num.match(re);
if (a != null)
{
if (len==15)
{
var D = new Date("19"+a[3]+"/"+a[4]+"/"+a[5]);
var B = D.getYear()==a[3]&&(D.getMonth()+1)==a[4]&&
D.getDate()==a[5];
}
else
{
var D = new Date(a[3]+"/"+a[4]+"/"+a[5]);
var B = D.getFullYear()==a[3]&&(D.getMonth()+1)==a[4]&&
D.getDate()==a[5];
}
if (!B) {alert("输入的n份证?nbsp;"+ a[0] +" 里出生日期不对！"
; return false;} }
return true;
}
3.7 复选框的全选，多选，全不选，反?nbsp;
<form name=hrong>
<input type=checkbox name=All onclick="checkAll('mm')">全?lt;br/>
<input type=checkbox name=mm onclick="checkItem('All')"><br/>
<input type=checkbox name=mm onclick="checkItem('All')"><br/>
<input type=checkbox name=mm onclick="checkItem('All')"><br/>
<input type=checkbox name=mm onclick="checkItem('All')"><br/>
<input type=checkbox name=mm onclick="checkItem('All')"><br/><br/>
<input type=checkbox name=All2 onclick="checkAll('mm2')">全?lt;br/>
<input type=checkbox name=mm2 onclick="checkItem('All2')"><br/>
<input type=checkbox name=mm2 onclick="checkItem('All2')"><br/>
<input type=checkbox name=mm2 onclick="checkItem('All2')"><br/>
<input type=checkbox name=mm2 onclick="checkItem('All2')"><br/>
<input type=checkbox name=mm2 onclick="checkItem('All2')"><br/>
</form>
<SCRIPT LANGUAGE="JavaScript">
function checkAll(str)
{
var a = document.getElementsByName(str);
var n = a.length;
for (var i=0; i<n; i++)
a[i].checked = window.event.srcElement.checked;
}
function checkItem(str)
{
var e = window.event.srcElement;
var all = eval("document.hrong."+ str);
if (e.checked)
{
var a = document.getElementsByName(e.name);
all.checked = true;
for (var i=0; i<a.length; i++)
{
if (!a[i].checked){ all.checked = false; break;}
}
}
else all.checked = false;
}
</SCRIPT>
3.8 文g上传q程中判断文件类?nbsp;
<input type=file onchange="alert(this.value.match(/^(.*)(\.)(.{1,8})Q?)[3])">
不断地清I剪贴板:
<body onload="setInterval('clipboardData.setData(\'Text\',\'\')',100)">
<script language="JavaScript" type="text/JavaScript">
//先复制一样东西，或者文本或者图?nbsp;
if(clipboardData.getData("Text"
||clipboardData.getData("HTML"||clipboardData.getData("URL"
) {
alert("有效行ؓ"
; }
全屏技术：
真正的全屏页面解决之道！Q全代码Q?nbsp;
真正全屏解决之道Q?nbsp;
1.htm
<title>无标题文?lt;/title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<body onload="window.open('fullscreen.htm',','fullscreen=1,scroll=no');">
fullscreen.htm
<title>无标题文?lt;/title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<script language="JavaScript1.2">
<!--
function opensmallwin(myurl){
var w2=300;//惛_出窗口的宽度
var h2=100;//惛_出窗口的高度
var w3=window.screen.width/2-w2/2;
var h3=window.screen.height/2-h2/2;
window.open(myurl,'small','toolbar=no,location=no,directories=no,status=no,menubar=no,
scrollbars=no,resizable=0,width='+ w2 +',height='+ h2 +',left='+ w3 +',top='+ h3 +');
}
//-->
<!--
function modelesswin(url,mwidth,mheight){
if (document.all&&window.print)
eval('window.external.m2_blocked(url,"","help:0;resizable:0;status:0;center:1;
scroll:0;dialogWidth:'+mwidth+'px;dialogHeight:'+mheight+'px"
') else
eval('window.open(url,"","width='+mwidth+'px,height='+mheight+'px,resizable=1,
scrollbars=1"
') }
//-->
<body scroll="no">
<div align="right"><a href="javascript:" onclick="window.close()">关闭
</a> </div>
<p></P>
<div align="right"><a href="javascript:" onclick="opensmallwin('login.htm')">d
</a> </div>
<p></P>
<div align="center"><a href="javascript:"
onclick="modelesswin('login.htm',300,160)">用模态登录窗?lt;/a> </div>
login.htm
<title>用户d</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style type="text/css">
<!--
body {
background-color: #EAEAEA;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 24px;
color: #336699;
}
input.boxline {
width: 100px;
font-family: "Times New Roman", "Times", "serif";
font-size: 9pt;
border: 1px solid #669999;
height: 18px;
}
input.whiteline {
font-size: 12px; border: 1px #999999 solid
}
-->
</style>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<table width="100%" height="100%" border="0" cellpadding="0"
cellspacing="14" bgcolor="#CCCCCC">
<tr valign="top">
<td width="10%" nowrap align="right"><b>用户名：</b></td>
<td width="90%"><input name="textfield1" type="text" size="25"
class="whiteline"></td>
</tr>
<tr valign="top">
<td nowrap align="right"><b>密 码：</b></td>
<td><input name="textfield12" type="password" size="25"
class="whiteline"></td>
</tr>
<tr valign="top">
<td> </td>
<td><input type="submit" name="Submit" value="癅R ?
class="boxline"></td>
</tr>
</table>
自动x原窗口：
<title>无标题文?lt;/title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style type="text/css">
<!--
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
-->
</style>
<body onload="window.open('fullscreen.htm',','fullscreen=1,scroll=no');
window.opener=null;window.close()">
<input type=button value=关闭 onclick="window.opener=null;window.close()">
<!-- IE5.5+ 不会有弹出提C?nbsp;-->
<OBJECT id=WebBrowser classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2
height=0 width=0></OBJECT>
<input type=button value=关闭H口 onclick=document.all.WebBrowser.ExecWB(45,1)>
关键是在onload事g中加入：
window.opener=null;window.close()
预读囄Q?nbsp;
<SCRIPT LANGUAGE="JavaScript">
<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! <a href=
http://javascript.internet.com target=_blank>
http://javascript.internet.com --> <!-- Begin
image1 = new Image();
image1.src = "image1.gif";
image2 = new Image();
image2.src = "image2.gif";
// End -->
关于两个|页h交互的问?nbsp;
JS处理ҎQ?nbsp;
a.htm
<a href="b.htm" target=blank>发表留言</a>
alert("wwwwwwwwwwwwwwwwwwwwwwwwww"
; b.htm
<script language="javascript">
//window.opener.location.reload();h父窗?nbsp;
//window.opener.location="2.htm"http://重定向父H口?.htm?nbsp;
function closewindow()
{
window.opener.location.reload();
self.close();
window.opener.document.write("sssssssssssssssssss"
; }
<a href="b.htm" target=blank onclick="closewindow();">关闭</a>
后台处理ҎQ?nbsp;
private btnForSubmit(Object sender,EventArgs e)
{
.............
Response.Write("window.opener.document.execCommand('refresh');
window.opener=';window.close();"
; //string str="window.opener.document.execCommand('refresh');
window.opener=';window.close();";
//this.RegisterStartupScript("mycode",str);
external.m2_blocked()、external.m2_blocked()Ҏ使用详解
Javascript有许多内建的Ҏ来生对话框Q如Qwindow.alert(),
window.confirm(),window.prompt().{?nbsp;然而IE提供更多的方法支持对话框。如Q?nbsp;
external.m2_blocked() (IE 4+ 支持)
external.m2_blocked() (IE 5+ 支持)
window.external.m2_blocked()Ҏ用来创徏一个显CHTML内容的模态对话框Q?BR>׃是对话框Q因此它q没有一般用window.open()打开的窗口的所有属性?nbsp;
window.external.m2_blocked()Ҏ用来创徏一个显CHTML内容的非模态对话框?nbsp;
当我们用external.m2_blocked()打开H口Ӟ不必用window.close()d闭它Q?BR>当以非模态方式[IE5]打开Ӟ 打开对话框的H口仍可以进行其他的操作Q即对话?BR>不L最上面的焦点，当打开它的H口QＲQ改变时Q它自动关闭。而模态[QIQ]
方式的对话框始终有焦点（焦点不可U走Q直到它关闭Q。模态对话框和打开它的H?BR>口相联系Q因此我们打开另外的窗口时Q他们的链接关系依然保存Qƈ且隐藏在zd
H口的下面?nbsp;
使用Ҏ如下Q?nbsp;
vReturnValue=window.external.m2_blocked(sURL [,vArguments] [,sFeatures])
vReturnValue=window.external.m2_blocked(sURL [,vArguments] [,sFeatures])
参数说明Q?nbsp;
sURL
必选参敎ͼcdQ字W串。用来指定对话框要显C的文档的URL?nbsp;
vArguments
可选参敎ͼcdQ变体。用来向对话框传递参数。传递的参数cd不限Q包括数l等?BR>对话框通过window.dialogArguments来取得传递进来的参数?nbsp;
sFeatures
可选参敎ͼcdQ字W串。用来描q对话框的外观等信息Q可以用以下的一个或几个Q?BR>用分号?”隔开?nbsp;
dialogHeight 对话框高度，不小于１Q０pxQﾃQ４中dialogHeight ?nbsp;dialogWidth
默认的单位是emQ而ﾃQ５中是pxQؓ方便其见Q在定义modal方式的对话框Ӟ用px
做单位?nbsp;
dialogWidth: 对话框宽度?nbsp;
dialogLeft: 距离桌面左的距离?nbsp;
dialogTop: L面上的距R?nbsp;
center: {yes | no | 1 | 0 }Q窗口是否居中，默认yesQ但仍可以指定高度和宽度?nbsp;
help: {yes | no | 1 | 0 }Q是否显C帮助按钮，默认yes?nbsp;
resizable: {yes | no | 1 | 0 } [QIQ＋]Q是否可被改变大。默认no?nbsp;
status: {yes | no | 1 | 0 } [IE5+]Q是否显C状态栏。默认ؓyes[ Modeless]
或no[Modal]?nbsp;
scroll:{ yes | no | 1 | 0 | on | off }Q指明对话框是否昄滚动条。默认ؓyes?nbsp;
q有几个属性是用在HTA中的Q在一般的|页中一般不使用?nbsp;
dialogHide:{ yes | no | 1 | 0 | on | off }Q在打印或者打印预览时对话框是否隐藏?BR>默认为no?nbsp;
edge:{ sunken | raised }Q指明对话框的边框样式。默认ؓraised?nbsp;
unadorned:{ yes | no | 1 | 0 | on | off }Q默认ؓno?nbsp;
传入参数Q?nbsp;
要想对话框传递参敎ͼ是通过vArguments来进行传递的。类型不限制Q对于字W串cdQ?BR>最大ؓ4096个字W。也可以传递对象，例如Q?nbsp;
test1.htm
====================
var mxh1 = new Array("mxh","net_lover","孟子E?
var mxh2 = window.open("about:blank","window_mxh"
// 向对话框传递数l?nbsp;
window.external.m2_blocked("test2.htm",mxh1)
// 向对话框传递window对象
window.external.m2_blocked("test3.htm",mxh2)
test2.htm
====================
var a = window.dialogArguments
alert("您传递的参数为：" + a)
test3.htm
====================
var a = window.dialogArguments
alert("您传递的参数为window对象Q名Uͼ" + a.name)
可以通过window.returnValue向打开对话框的H口q回信息Q当然也可以是对象?BR>例如Q?nbsp;
test4.htm
===================
var a = window.external.m2_blocked("test5.htm"
for(i=0;i<a.length;i++) alert(a[i])
test5.htm
===================
function sendTo()
{
var a=new Array("a","b"
window.returnValue = a
window.close()
}
<form>
<input value="q回" type=button onclick="sendTo()">
</form>
常见问题Q?nbsp;
1Q如何在模态对话框中进行提交而不新开H口Q?nbsp;
如果?nbsp;?nbsp;览器是IE5.5+,可以在对话框中用带name属性的iframeQ提交时可以
制定targetiframe的name。对于IE4+Q你可以用高度ؓ0的frame来作Q例子，
test6.htm
===================
window.external.m2_blocked("test7.htm"
test7.htm
===================
if(window.location.search) alert(window.location.search)
<frameset rows="0,*">
<frame src="about:blank">
<frame src="test8.htm">
</frameset>
test8.htm
===================
<form target="_self" method="get">
<input name=txt value="test">
<input type=submit>
</form>
if(window.location.search) alert(window.location.search)
2,可以通过
//屏蔽鼠标右键、Ctrl+N、Shift+F10、F5h、退格键 //屏蔽F1帮助
function window.onhelp()
{
return false
}
function KeyDown()
{
//alert(event.keyCode);
//屏蔽 Alt+ 方向?nbsp;?nbsp;屏蔽 Alt+ 方向?nbsp;?nbsp;
if ((window.event.altKey)&&((window.event.keyCode==37)||
(window.event.keyCode==39)))
{
//alert("不准你用ALT+方向键前q或后退|页Q?
; event.returnValue=false;
}
//屏蔽退格删除键,屏蔽 F5 h?Ctrl + R
if ((event.keyCode==116)||(event.ctrlKey && event.keyCode==82))
{
event.keyCode=0;
event.returnValue=false;
}
//屏蔽 Ctrl+n
if ((event.ctrlKey)&&(event.keyCode==78))
{
event.returnValue=false;
}
//屏蔽 shift+F10
if ((event.shiftKey)&&(event.keyCode==121))
{
event.returnValue=false;
}
//屏蔽 shift 加鼠标左键新开一|页
if (window.event.srcElement.tagName == "A" && window.event.shiftKey)
{
window.event.returnValue = false;
}
//屏蔽Alt+F4
if ((window.event.altKey)&&(window.event.keyCode==115))
{
window.external.m2_blocked("about:blank","","dialogWidth:1px;dialogheight:1px"
; return false;
}
//屏蔽Ctrl+A
if((event.ctrlKey)&&(event.keyCode==65))
{
return false;
}
}
</HTML>
Joshua Yan 2005-10-28 13:26 发表评论
]]>