JavaScript综全『转载』 - 缘来如此

javascript 事件查询综合

click() 对象 .click() 使对象被点击。

closed 对象 .closed 对象窗口是否已关闭 true/false

clearTimeout( 对象 ) 清除已设置的 setTimeout 对象

clearInterval( 对象 ) 清除已设置的 setInterval 对象

confirm(" 提示信息 ") 弹出确认框，确定返回 true 取消返回 false

cursor: 样式更改鼠标样式 hand crosshair text wait help default auto e/s/w/n-resize

event.clientX 返回最后一次点击鼠标 X 坐标值；

event.clientY 返回最后一次点击鼠标 Y 坐标值；

event.offsetX 返回当前鼠标悬停 X 坐标值

event.offsetY 返回当前鼠标悬停 Y 坐标值

document.write(document.lastModified) 网页最后一次更新时间

document.ondblclick=x 当双击鼠标产生事件

document. 单击鼠标键产生事件

document.body.scrollTop; 返回和设置当前竖向滚动条的坐标值，须与函数配合 ,

document.body.scrollLeft; 返回和设置当前横向滚动务的坐标值，须与函数配合，

document.title document.title="message"; 当前窗口的标题栏文字

document.bgcolor document.bgcolor=" 颜色值 "; 改变窗口背景颜色

document.Fgcolor document.Fgcolor=" 颜色值 "; 改变正文颜色

document.linkcolor document.linkcolor=" 颜色值 "; 改变超联接颜色

document.alinkcolor document.alinkcolor=" 颜色值 "; 改变正点击联接的颜色

document.VlinkColor document.VlinkColor=" 颜色值 "; 改变已访问联接的颜色

document.forms.length 返回当前页 form 表单数

document.anchors.length 返回当前页锚的数量

document.links.length 返回当前页联接的数量

document. 单击鼠标触发事件

document.ondblclick=x 双击鼠标触发事件

defaultStatus window.status=defaultStatus; 将状态栏设置默认显示

function function xx(){...} 定义函数

isNumeric 判断是否是数字

innerHTML xx= 对象 .innerHTML 输入某对象标签中的 html 源代码

innerText divid.innerText=xx 将以 div 定位以 id 命名的对象值设为 XX

location.reload(); 使本页刷新， target 可等于一个刷新的网页

Math.random() 随机涵数 , 只能是 0 到 1 之间的数 , 如果要得到其它数 , 可以为 *10, 再取整

Math.floor(number) 将对象 number 转为整数，舍取所有小数

Math.min(1,2) 返回 1,2 哪个小

Math.max(1,2) 返回 1,2 哪个大

navigator.appName 返回当前浏览器名称

navigator.appVersion 返回当前浏览器版本号

navigator.appCodeName 返回当前浏览器代码名字

navigator.userAgent 返回当前浏览器用户代标志

onsubmit onsubmit="return(xx())" 使用函数返回值

opener opener.document. 对象控制原打开窗体对象

prompt xx=window.prompt(" 提示信息 "," 预定值 "); 输入语句

parent parent. 框架名 . 对象控制框架页面

return return false 返回值

random 随机参数（ 0 至 1 之间）

reset() form.reset(); 使 form 表单内的数据重置

split("") string.split("") 将 string 对象字符以逗号隔开

submit() form 对象 .submit() 使 form 对象提交数据

String 对象的 charAt(x) 对象反回指定对象的第多少位的字母

lastIndexOf("string") 从右到左询找指定字符，没有返回 -1

indexOf("string") 从左到右询找指定字符，没有返回 -1

LowerCase() 将对象全部转为小写

UpperCase() 将对象全部转为大写

substring(0,5) string.substring(x,x) 返回对象中从 0 到 5 的字符

setTimeout("function",time) 设置一个超时对象

setInterval("function",time) 设置一个超时对象

toLocaleString() x.toLocaleString() 从 x 时间对象中获取时间，以字符串型式存在

typeof( 变量名 ) 检查变量的类型，值有： String,Boolean,Object,Function,Underfined

window.event.button==1/2/3 鼠标键左键等于 1 右键等于 2 两个键一起按为 3

window.screen.availWidth 返回当前屏幕宽度 ( 空白空间 )

window.screen.availHeight 返回当前屏幕高度 ( 空白空间 )

window.screen.width 返回当前屏幕宽度 ( 分辨率值 )

window.screen.height 返回当前屏幕高度 ( 分辨率值 )

window.document.body.offsetHeight; 返回当前网页高度

window.document.body.offsetWidth; 返回当前网页宽度

window.resizeTo(0,0) 将窗口设置宽高

window.moveTo(0,0) 将窗口移到某位置

window.focus() 使当前窗口获得焦点

window.scroll(x,y) 窗口滚动条坐标， y 控制上下移动，须与函数配合

window.open() window.open(" 地址 "," 名称 "," 属性 ")

属性 :toolbar( 工具栏 ),location( 地址栏 ),directions,status( 状态栏 ),

menubar( 菜单栏 ),scrollbar( 滚动条 ),resizable( 改变大小 ), width( 宽 ),height( 高 ),fullscreen( 全屏 ),scrollbars( 全屏时无滚动条无参数 ,channelmode( 宽屏 ),left( 打开窗口 x 坐标 ),top( 打开窗口 y 坐标 )

window.location = 'view-source:' + window.location.href 应用事件查看网页源代码 ;

a=new Date(); // 创建 a 为一个新的时期对象

y=a.getYear(); //y 的值为从对象 a 中获取年份值两位数年份

y1=a.getFullYear(); // 获取全年份数四位数年份

m=a.getMonth(); // 获取月份值

d=a.getDate(); // 获取日期值

d1=a.getDay(); // 获取当前星期值

h=a.getHours(); // 获取当前小时数

m1=a.getMinutes(); // 获取当前分钟数

s=a.getSeconds(); // 获取当前秒钟数

对象 .style.fontSize=" 文字大小 ";

单位： mm/cm/in 英寸 /pc 帕 /pt 点 /px 象素 /em 文字高

1in =1.25cm

1pc=12pt

1pt =1.2px(800*600 分辩率下 )

文本字体属性：

fontSize 大小

family 字体

color 颜色

fontStyle 风格，取值为 normal 一般 ,italic 斜体 ,oblique 斜体且加粗

fontWeight 加粗 , 取值为 100 到 900 不等 ,900 最粗 ,light,normal,bold

letterSpacing 间距 , 更改文字间距离 , 取值为 ,1pt,10px,1cm

textDecoration: 文字修饰 ; 取值 ,none 不修饰 ,underline 下划线 ,overline 上划线

background: 文字背景颜色 ,

backgroundImage: 背景图片 , 取值为图片的插入路径

点击网页正文函数调用触发器：

1.onClick 当对象被点击

2.onLoad 当网页打开 , 只能书写在 body 中

3.onUnload 当网页关闭或离开时 , 只能书写在 body 中

4. 当鼠标悬于其上时

5. 当鼠标离开对象时

6. 当鼠标松开

7. 当鼠标按下键

8.onFocus 当对象获取焦点时

9.onSelect 当对象的文本被选中时

10.onChange 当对象的内容被改变

11.onBlur 当对象失去焦点

onsubmit=return(ss()) 表单调用时返回的值

直线 border-bottom:1x solid black

虚线 border-bottom:1x dotted black

点划线 border-bottom:2x dashed black

双线 border-bottom:5x double black

槽状 border-bottom:1x groove black

脊状 border-bottom:1x ridge black

1. 边缘高光 glow(color= 颜色 ,strength= 亮光大小 )<br/>

2. 水平翻转 fliph() 使对象水平翻转 180 度 <br/>

3. 垂直翻转 flipv() 使对象垂直翻转 180 度 <br/>

4. 对象模糊 blur(add=true/false direction= 方向 strength= 强度 )

add 指定是否按印象画派进行模糊 direction 模糊方向 strength 模糊强度

5. 对象透明 alpha(opaction=0-100,finishopacity=0-100,style=0/1/2/3)

opaction 对象整体不透明值 finishopacity 当对象利用了渐透明时该项指定结束透明位置的不透明值 style 指定透明方式 0 为整体透明， 1 为线型透明， 2 为圆型透明， 3 为矩形透明

6. 去除颜色 chroma(color= 颜色值 ) 使对象中颜色与指定颜色相同区域透明

7. 建立阴影 dropshadow(color= 阴影颜色 ,offx= 水平向左偏离像素 ,offy= 水平向下偏离像素 )

8. 去色 gray() 使对象呈灰度显示

9. 负片效果 invert() 使对象呈底片效果

10. 高光 light() 使对象呈黑色显示

11. 遮盖 mask(color= 颜色 ) 使整个对象以指定颜色进行蒙板一次

opacity 表透明度水平 .0~100,0 表全透明 ,100 表完全不透明

finishopacity 表想要设置的渐变透明效果 .0~100.

style 表透明区的形状 .0 表统一形状 .1 表线形 .2 表放射形 .3 表长方形 .

startx.starty 表渐变透明效果的开始时 X 和 Y 坐标 .

finishx,finishy 渐变透明效果结束时 x,y 的坐标 .

add 有来确定是否在模糊效果中使有原有目标 . 值为 0,1.0 表 " 否 ",1 表 " 是 ".

direction 设置模糊的方向 .0 度表垂直向上 ,45 度为一个单位 . 默认值是向左 270 度 .left,right,down,up.

strength 只能用整数来确定 . 代表有多少个像素的宽度将受到模糊影响 . 默认是 5 个 .

color 要透明的颜色 .

offx,offy 分别是 x,y 方向阴影的偏移量 .

positive 指投影方式 .0 表透明像素生成阴影 .1 表只给出不透明像素生成阴影 ..

AddAmbient: 加入包围的光源 .

AddCone: 加入锥形光源 .

AddPoint 加入点光源

Changcolor: 改变光的颜色．

Changstrength: 改变光源的强度．

Clear: 清除所有的光源．

MoveLight: 移动光源．

freq 是波纹的频率，在指定在对象上一区需要产生多少个完事的波纹．

lightstrength 可对于波纹增强光影的效果．显著 0~100 正整数，正弦波开始位置是 0~360 度． 0 表从 0 度开始， 25 表从 90 度开始．

strength 表振幅大小．

hand style="cursor:hand"

crosshair style="cursor:crosshair"

text style="cursor:text"

wait style="cursor:wait"

default style="cursor:default"

help style="cursor:help"

e-resize style="cursor:e-resize"

ne-resize style="cursor:ne-resize"

n-resize style="cursor:n-resize"

nw-resize style="cursor:nw-resize"

w-resize style="cursor:w-resize"

s-resize style="cursor:s-resize"

sw-resize style="cursor:sw-resize "

se-resize style="cursor:se-resize"

auto style="cursor:auto"

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML>

<HEAD>

<TITLE> 数字输入控制 , 给数字加上千分符 </TITLE>

<style>

.inputRight {

text-align: right;

border: 1px #666666 dashed;

font-size: 9pt;

color: #993366;

height: 18px;

ime-mode : disabled;

}

</style>

/*

这些功能建议通过 HTC 来实现

*/

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

// 数字输入控制

function FormatInput(dotlen)

{

var myEle=event.srcElement;

var myValue=String.fromCharCode(event.keyCode);

if (myEle.readOnly)

{

return;

}

switch(dotlen)

{

// 原正则表达式 ( 可以输入负数 ):/^[\-]?\d*\.?\d{0,0}$/

case 0:{event.returnValue = regInput(myEle, /^\d*\.?\d{0,0}$/, myValue); break;}

case 1:{event.returnValue = regInput(myEle, /^\d*\.?\d{0,1}$/, myValue); break;}

case 2:{event.returnValue = regInput(myEle, /^\d*\.?\d{0,2}$/, myValue); break;}

case 3:{event.returnValue = regInput(myEle, /^\d*\.?\d{0,3}$/, myValue); break;}

case 4:{event.returnValue = regInput(myEle, /^\d*\.?\d{0,4}$/, myValue); break;}

case 5:{event.returnValue = regInput(myEle, /^\d*\.?\d{0,5}$/, myValue); break;}

case 6:{event.returnValue = regInput(myEle, /^\d*\.?\d{0,6}$/, myValue); break;}

case 7:{event.returnValue = regInput(myEle, /^\d*\.?\d{0,7}$/, myValue); break;}

case 8:{event.returnValue = regInput(myEle, /^\d*\.?\d{0,8}$/, myValue); break;}

default :{event.returnValue = regInput(myEle, /^\d*\.?\d{0,0}$/, myValue); break;}

}

function regInput(obj, reg, inputStr)

{

var docSel = document.selection.createRange()

if (docSel.parentElement().tagName != "INPUT") return false

oSel = docSel.duplicate()

oSel.text = ""

var srcRange = obj.createTextRange()

oSel.setEndPoint("StartToStart", srcRange)

var str = oSel.text + inputStr + srcRange.text.substr(oSel.text.length)

return reg.test(str)

}

// 给数字加上千分符 by yuanzy

function splitNumber(eValue)

{

var intPart = "";

var decPart = "";

if (eValue.indexOf(",")>=0)

{

eValue=eValue.replace(/,/g,"");

}

if (eValue.indexOf(".")>=0)

{

intPart=eValue.split(".")[0];

decPart=eValue.split(".")[1];

}

else

{

intPart = eValue;

}

var num = intPart+"";

var re=/(-?\d+)(\d{3})/

while(re.test(num)){

num=num.replace(re,"$1,$2")

}

if (eValue.indexOf(".")>=0)

{

eValue=num + "." + decPart;

}

else

{

eValue=num ;

}

return eValue;

}

function oFocus()

{

if (event.srcElement.readOnly) return;

event.srcElement.value=event.srcElement.value.replace(/,/g,"");

}

function oBlur()

{

if (event.srcElement.value=="-")

{

event.srcElement.value="";

}

event.srcElement.value = splitNumber(event.srcElement.value);

}

</SCRIPT>

</HEAD>

<BODY>

</BODY>

</HTML>

IE 功能汇总

<OBJECT id=WebBrowser height=0 width=0

classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2></OBJECT>

窗口打开自动最大化代码

if(window.screenLeft!=0)

max.Click();

</script>

利用脚本封装，方便实现网站悬浮广告

下面是 JS 脚本 (floatdiv.js)

/*======================================================================

浮动块支持脚本

DESIGN BY : 彭国辉

DATE: 2004-02-26

SITE: http://kacarton.yeah.net/

BLOG: http://blog.csdn.net/nhconch

EMAIL: kacarton@sohu.com

文章为作者原创，转载前请先与本人联系，转载请注明文章出处、保留作者信息，谢谢支持！

======================================================================*/

var alLeft = 0, alCenter = 1, alRight = 2; // 水平对齐方式

var alTop = 0, alMiddle = 1, alBottom = 2; // 垂直对齐方式

var f = new Array();

var cnt = 0;

function floatDiv(objId, align, vAlign, x, y, smooth)

{

/* 浮动块对象

数据结构：

objId ：对象 ID

align ：水平对齐方式，枚举型

vAlign ：垂直对齐方式，枚举型内容

x, y ： xy 坐标，整型

smooth ：平滑移动，布尔型

*/

this.objId = objId;

this.align = align;

this.vAlign = vAlign;

this.x = x;

this.y = y;

this.smooth = smooth;

}

function addDiv(objId, align, vAlign, x, y, smooth)

{ // 添加浮动块

f[cnt++] = new floatDiv(objId, align, vAlign, x, y, smooth);

}

function floatMove()

{ // 重新定位各块位置

var objX, objY;

if (document.all)

{

var d = document.body;

//status = "scrollLeft:"+f[0].objId.style.pixelTop+"| offsetWidth:"+d.offsetWidth;

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

{

switch (f[i].align)

{

case alLeft : objX = d.scrollLeft + f[i].x; break;

case alCenter: objX = d.scrollLeft + Math.ceil((d.offsetWidth - f[i].objId.offsetWidth)/2) + f[i].x; break;

case alRight : objX = d.scrollLeft + d.offsetWidth - f[i].x - f[i].objId.offsetWidth - 20; break; // 减滚动条 20

}

switch (f[i].vAlign)

{

case alTop : objY = d.scrollTop + f[i].y; break;

case alMiddle: objY = d.scrollTop + Math.ceil((d.offsetHeight - f[i].objId.offsetHeight)/2) + f[i].y; break;

case alBottom: objY = d.scrollTop + d.offsetHeight - f[i].y - f[i].objId.offsetHeight; break;

}

if (f[i].smooth)

smoothMove(f[i].objId, objX, objY);

else

{

f[i].objId.style.pixelLeft = objX;

f[i].objId.style.pixelTop = objY;

}

if (document.layers)

{

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

{

var objId = f[i].objId;

switch (f[i].align)

{

case alLeft : objX = pageXOffset + f[i].x; break;

case alCenter: objX = pageXOffset + Math.ceil((window.innerWidth-objId.width)/2) + f[i].x; break;

case alRight : objX = pageXOffset + window.innerWidth - f[i].x - document.objId.width; break;

}

switch (f[i].vAlign)

{

case alTop : objY = pageYOffset + f[i].y; break;

case alMiddle: objY = pageYOffset + Math.ceil(window.innerHeight/2) + f[i].y; break;

case alBottom: objY = pageYOffset + window.innerHeight - f[i].y - document.objId.height; break;

}

if (t[i].smooth) smoothMove(f[i].objId, objX, objY);

else

{

document.objId.left = objX;

document.objId.top = objY;

}

setTimeout("floatMove();",50);

}

function smoothMove(obj, x, y)

{

var percent;

if (document.all)

{

percent = .1 * (x - obj.style.pixelLeft);

if (percent > 0) percent = Math.ceil(percent); else percent = Math.floor(percent);

obj.style.pixelLeft += percent;

percent = .1 * (y - obj.style.pixelTop);

if (percent > 0) percent = Math.ceil(percent); else percent = Math.floor(percent);

obj.style.pixelTop += percent;

}

if (document.layers)

{

percent = .1 * (x - document.objId.left);

if (percent > 0) percent = Math.ceil(percent); else percent = Math.floor(percent);

document.objId.left += percent;

percent = .1 * (y - document.objId.top);

if (percent > 0) percent = Math.ceil(percent); else percent = Math.floor(percent);

document.objId.top += percent;

}

setTimeout("floatMove();",50);

调用例子：

if (navigator.appName == "Netscape")

{

document.write("<layer id=ad_hr top=300 width=100 height=120><a href=http://www.fpc.org.cn/hr/040522.htm target=_blank><img src='ad/hr40522.gif' width=120 height=180 border=0></a></layer>");

}

else

{

document.write("<div id=ad_hr style='position: absolute;width:120;top:300;left:5;visibility: visible;z-index: 1'><a href=http://www.fpc.org.cn/hr/040522.htm target=_blank><img src='ad/hr40522.gif' width=120 height=180 border=0></a></div>");

}

addDiv(ad_hr, alRight, alTop, 0, 30, true);

</script>

[ 原创 ] 自己定义的简单方法验证表单数据

方法很简单，先是定义好要验证的数组比如 :

check_array[0]= new Array(title, 留言主题不能为空 !);

然后判断，错误的就提示定义的内容，代码如下 :

// 表单验证程序；

// 定义获取表单元素；

function $()

{

var elements = new Array();

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

var element = arguments[i];

if (type of element == 'string')

element = document.getElementById(element);

if (arguments.length == 1)

return element;

elements.push(element);

}

return elements;

}

function checkform()

{

// 定义要验证的表单数组；

var check_array=new Array();

check_array[0]= new Array("title"," 留言主题不能为空 !");

check_array[1]= new Array("name"," 姓名不能为空 !");

check_array[2]= new Array("email"," 电子邮件不能为空 !");

check_array[3]= new Array("phone"," 电话不能为空 !");

check_array[4]= new Array("note"," 留言内容不能为空 !");

// 验证定义表单是否为空 ;

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

{

if($(check_array[i][0]).value=="")

{

alert(check_array[i][1]);

$(check_array[i][0]).focus();

return false;

}

</script>

几个表单验证的

function checkMail(obj,error)

{

if (obj == null)

return "NULL";

if (obj.value == "")

return "EMPTY";

var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;

if (filter.test(obj.value))

return true;

else

alert(error);

return false;

}

function verifyDottedIP(cntrl,errmsg1,errmsg2,flag)

{

ip_str = cntrl.value;

if (ip_str == "") {

if (flag == 1){

alert(errmsg1);

cntrl.select();

return false;

}

return true;

}else{

varval = 0;

vari = index = 0;

while (index < ip_str.lastIndexOf(".")){

k = index;

index = ip_str.indexOf(".", index);

val = toNumber(ip_str, k, index);

if (val < 0 || val > 255)

break;

i++;

index++;

}

if (i == 3){

if (index == ip_str.length){

i = 2;

} else {

val = toNumber(ip_str,index, ip_str.length);

if (val < 0 || val > 255) i = 2;

}

if (i != 3) {

alert(errmsg2);

cntrl.select();

return false;

}

return true;

}

function verifyport(cntrl,errmsg1,errmsg2,flag)

{

varval = 0;

port_str = cntrl.value;

if (port_str == "") {

if (flag == 1){

alert(errmsg1);

cntrl.select();

return false;

}}

val = toNumber(port_str, 0, port_str.length);

if (val < 0 || val > 65535)

{

alert(errmsg2);

cntrl.select();

return false;

}

else

{

return true;

}

function checkname(field,err_blank,err_space,err_invalid)

{

if (field.value.indexOf(" ") >=0)

{

alert(err_space);

field.focus();

field.select();

return false;

}

left_trim(field);

right_trim(field);

if (field.value =="" | field.value == null)

{

alert(err_blank);

field.focus();

field.select();

return false;

}

if (checkOtherChar(field.value, err_invalid)==false)

{

field.focus();

field.select();

return false;

}

if (isChinese(field.value)==true)

{

field.focus();

field.select();

return false;

}

return true;

}

function isChinese(inputStr){

iLength = inputStr.length

for (i = 0; i < iLength; i++)

if (inputStr.charCodeAt(i) > 255){

alert("Input error!");

return true ;

}

return false ;

}

function left_trim(field)

{

var tmp_string = field.value;

while (''+tmp_string.charAt(0) == ' ')

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

field.value = tmp_string;

}

function right_trim(field)

{

var tmp_string = field.value;

while (''+tmp_string.charAt(tmp_string.length-1) == ' ')

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

field.value = tmp_string;

}

function checkOtherChar(str,errmsg) {

for(var loop_index=0; loop_index<str.length; loop_index++)

{

if(str.charAt(loop_index) == '~'

||str.charAt(loop_index) == '!'

||str.charAt(loop_index) == '@'

||str.charAt(loop_index) == '#'

||str.charAt(loop_index) == '$'

||str.charAt(loop_index) == '%'

||str.charAt(loop_index) == '^'

||str.charAt(loop_index) == '&'

||str.charAt(loop_index) == '*'

||str.charAt(loop_index) == '('

||str.charAt(loop_index) == ')'

||str.charAt(loop_index) == '+'

||str.charAt(loop_index) == '{'

||str.charAt(loop_index) == '}'

||str.charAt(loop_index) == '|'

||str.charAt(loop_index) == ':'

||str.charAt(loop_index) == '"'

||str.charAt(loop_index) == '<'

||str.charAt(loop_index) == '>'

||str.charAt(loop_index) == '?'

||str.charAt(loop_index) == '`'

||str.charAt(loop_index) == '='

||str.charAt(loop_index) == '['

||str.charAt(loop_index) == ']'

||str.charAt(loop_index) == '\\'

||str.charAt(loop_index) == ';'

||str.charAt(loop_index) == '\''

||str.charAt(loop_index) == ','

||str.charAt(loop_index) == '.'

||str.charAt(loop_index) == '/')

{

alert(errmsg);

return false;

}

return true;

}

function check_pwd_eq(element1,element2,errmsg)

{

if (element1.value == element2.value)

{

return true;

}

else

{

alert(errmsg);

element1.select();

return false;

}

function check_pwd(field,errmsg1)

{

if (field.value == "") {

alert(errmsg1);

field.focus();

return false;

}

return true;

}

function verifynum(cntrl,errmsg3,flag,errmsg1,errmsg2,from,to)

{

varval = 0;

num_str = cntrl.value;

if (num_str.indexOf(" ") >=0)

{

alert(errmsg3);

cntrl.focus();

cntrl.select();

return false;

}

if (flag == 1) {

if (num_str == "") {

alert(errmsg1);

return false;

}}

val = toNumber(num_str, 0, num_str.length);

if ((val < from || val > to) && (num_str != ""))

{

alert(errmsg2);

return false;

}

else

{

return true;

}

判断浏览器类型

if(navigator.appVersion.indexOf("MSIE 6.") != -1 ){

window.location = "111.htm" ;

}

</SCRIPT>

按钮背景图片替换

document.getElementById(id) 的最简化调用

/*--------------------------------------------------------------------------*/

/**

* 这个函数就 Ruby 了。我觉得它的作用主要有两个

* 1. 大概是 document.getElementById(id) 的最简化调用。

* 比如： $(aaa) 将返回 aaa 对象

* 2. 得到对象数组

* 比如 : $(aaa,bbb) 返回一个包括 id 为 aaa 和 bbb 两个

input 控件对象的数组。

*/

function $() {

var elements = new Array();

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

var element = arguments[i];

if (typeof element == 'string')

element = document.getElementById(element);

if (arguments.length == 1)

return element;

elements.push(element);

}

return elements;

}

// 屏蔽鼠标右键、 Ctrl+N 、 Shift+F10 、 F5 刷新、退格键

// 屏蔽 F1 帮助

function window.onhelp()

{

return false

}

function KeyDown()

{

//alert(event.keyCode);

// 屏蔽 Alt+ 方向键 ← 屏蔽 Alt+ 方向键 →

if ((window.event.altKey)&&((window.event.keyCode==37)||(window.event.keyCode==39)))

{

//alert(" 不准你使用 ALT+ 方向键前进或后退网页！ ");

event.returnValue=false;

}

// 屏蔽退格删除键 , 屏蔽 F5 刷新键 ,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.showModelessDialog("about:blank","","dialogWidth:1px;dialogheight:1px");

return false;

}

// 屏蔽 Ctrl+A

if((event.ctrlKey)&&(event.keyCode==65))

{

return false;

}

return false;

}

document.onkeydown=KeyDown;

</script>

根据身份证号码取得生日与性别，并判断 18 位身份证的正确与错误 :

function showBirthday(val){

var birthdayValue;

if(15==val.length){//15 位身份证号码

birthdayValue = val.charAt(6)+val.charAt(7);

if(parseInt(birthdayValue)<10){

birthdayValue = '20'+birthdayValue;

}else{

birthdayValue = '19'+birthdayValue;

}

birthdayValue=birthdayValue+'-'+val.charAt(8)+val.charAt(9)+'-'+val.charAt(10)+val.charAt(11);

if(parseInt(val.charAt(14)/2)*2!=val.charAt(14))

document.all.sex.value=' 男 ';

else

document.all.sex.value=' 女 ';

document.all.birthday.value=birthdayValue;

}

if(18==val.length){//18 位身份证号码

birthdayValue=val.charAt(6)+val.charAt(7)+val.charAt(8)+val.charAt(9)+'-'+val.charAt(10)+val.charAt(11)+'-'+val.charAt(12)+val.charAt(13);

if(parseInt(val.charAt(16)/2)*2!=val.charAt(16))

document.all.sex.value=' 男 ';

else

document.all.sex.value=' 女 ';

if(val.charAt(17)!=IDCard(val)){

document.all.idCard.style.backgroundColor='#ffc8c8';

}else{

document.all.idCard.style.backgroundColor='white';

}

document.all.birthday.value=birthdayValue;

}

// 18 位身份证号最后一位校验

function IDCard(Num)

{

if (Num.length!=18)

return false;

var x=0;

var y='';

for(i=18;i>=2;i--)

x = x + (square(2,(i-1))%11)*parseInt(Num.charAt(19-i-1));

x%=11;

y=12-x;

if (x==0) y='1';

if (x==1) y='0';

if (x==2) y='X';

return y;

}

// 求得 x 的 y 次方

function square(x,y)

{

var i=1;

for (j=1;j<=y;j++)

i*=x;

return i;

}

身份证 <input type="text" name="idCard">

性别 <input type="text" name="sex">

生日 <input type="text" name="birthday">

获取页面中控件的 ID:( 查错时可能有用 )

function clk()

{

document.all('TextBox1').value=event.srcElement.id;

}

document.onclick=clk;

　 B.27 string 对象

　　它不是另一个对象的属性 , 而是一个内置对象 , 即一串字符字符串输入脚本中时必须位于引号内。

　　属性

　　 length 字符串中的字符个数

　　方法

　　 anchor() 用来把字符串转换到 HTML 锚点标记内 (<A NAME=>)

　　 big() 把字符串中的文本变成大字体 (<BIG>)

　　 blink() 把字符串中的文本变成闪烁字体 (<BLINK>)

　　 bold() 把字符串中的文本变成黑字体 (<B>)

　　 charAt() 寻找字符串中指定位置的一个字符

　　 fixed() 把字符串中的文本变成固定间距字体 (<TT>)

　　 fontcolor() 改变字符串中文本的颜色 (<FONT COLOR=>)

　　 fontsize() 把字符串中的文本变成指定大小 (<FONTSIZE=>)

　　 indexOf() 用来搜索字符串中的某个特殊字符 , 并返回该字符的索引位置

　　 italics() 把字符串中的文本变成斜字体 (<I>)

　　 lastlndexOf() 与 indexof 相似 , 但是向后搜索最后一个出现的字符

　　 link() 用来把字符串转换到 HTML 链接标记中 (<A HREF=>)

　　 small() 把字符串中的文本变成小字体 (<SMALL>)

　　 strike() 把字符串中的文本变成划掉字体 (<STRIKE>)

　　 sub() 把字符串中的文本变成下标 (subscript) 字体 ((SUB>)

　　 substring() 返回字符串里指定位置间的一部分字符串

　　 sup() 把字符串中的文本变成上标 (superscript) 字体 (<SUP>)

　　 toLowerCase() 把字符串中的文本变成小写

　　 toUpperCase() 把字符串中的文本变成大写

　　 B.28 submit 对象

　　它是 form 对象的一个属性 , 窗体中的一个提交按钮 (<INPUT TYPE= ” SUBMIT ” >) 。

　　属性

　　 name 对象的名字 (NAME= 特性 )

　　 value VALUE= 特性

　　方法

　　 click 模拟鼠标单击按钮

　　事件处理程序

　　 Onclick 点击

　　 B.29 text 对象

　　它是 form 对象的一个属性 , 宙体中的一个文本域 (<INPUT TYPE= ” TEXT ” >) 。

　　属性

　　 defaultValue text 对象的缺省值 (VALUE= 特性 )

　　 name 该对象的名字 (NAME= 特性 )

　　 Value 该域具有的当前值 , 最初与 VALUE= 特性 (defaultValue) 相同但是 , 如果脚本修改了该域中的值 , 则该值将改变

　　方法

　　 blur 把焦点从文本框移开

　　 focus 把焦点移到文本框

　　 select 选择输入区域

　　事件处理程序

　　 Onblur 失去焦点事件

　　 Onchange 更改

　　 Onfocus 聚焦事件

　　 Onselect 选取事件

　　 B.30 textarea 对象

　　它是 form 对象的一个属性 , 宙体中的一个文本区域 (<TEXTAREA>) 。

　　属性

　　 defaultValue textarea 对象的缺省值 (VALUE= 特性 )

　　 name 该对象的名字 (NAME= 特性 )

　　 value 该域具有的当前值 , 最初与 VALUE= 特性 (defaultValue) 相同 , 但是 , 如果脚本修改了该域中的值 , 则该值将改变了。

　　方法

　　 blur 把焦点从文本区移开

　　 focus 把焦点移到文本区

　　 select 选择输入区域事件处理程序

　　事件处理程序

　　 Onblur 失去焦点事件

　　 Onchange 更改

　　 Onfocus 聚焦事件

　　 Onselect 选取事件

　　 B.31 window 对象

　　它是一个顶层对象 , 而不是另一个对象的属性即浏览器的窗口。

　　属性

　　 defaultStatus 缺省的状态条消息

　　 document 当前显示的文档 ( 该属性本身也是一个对象 )

　　 frame 窗口里的一个框架 ((FRAME>)( 该属性本身也是一个对象 )

　　 frames array 列举窗口的框架对象的数组 , 按照这些对象在文档中出现的顺序列出 ( 该属性本身也是一个对象 )

　　 history 窗口的历史列表 ( 该属性本身也是一个对象 )

　　 length 窗口内的框架数

　　 location 窗口所显示文档的完整 ( 绝对 )URL( 该属性本身也是一个对象 ) 不要把它与如 document.location 混淆 , 后者是当前显示文档的 URL 。用户可以改变 window.location( 用另一个文档取代当前文档 ), 但却不能改变 document.location( 因为这是当前显示文档的位置 )

　　 name 窗口打开时 , 赋予该窗口的名字

　　 opener 代表使用 window.open 打开当前窗口的脚本所在的窗口 ( 这是 Netscape Navigator 3.0beta 3 所引入的一个新属性 )

　　 parent 包含当前框架的窗口的同义词。 frame 和 window 对象的一个属性

　　 self 当前窗口或框架的同义词

　　 status 状态条中的消息

　　 top 包含当前框架的最顶层浏览器窗口的同义词

　　 window 当前窗口或框架的同义词 , 与 self 相同

　　方法

　　 alert() 打开一个 Alert 消息框

　　 clearTimeout() 用来终止 setTimeout 方法的工作

　　 close() 关闭窗口

　　 confirm() 打开一个 Confirm 消息框 , 用户可以选择 OK 或 Cancel, 如果用户单击 OK, 该方法返回 true, 单击 Cancel 返回 false

　　 blur() 把焦点从指定窗口移开 ( 这是 Netscape Navigator 3.0 beta 3 引入的新方法 )

　　 focus() 把指定的窗口带到前台 ( 另一个新方法 )

　　 open() 打开一个新窗口

　　 prompt() 打开一个 Prompt 对话框 , 用户可向该框键入文本 , 并把键入的文本返回到脚本

　　 setTimeout() 等待一段指定的毫秒数时间 , 然后运行指令事件处理程序

　　事件处理程序

　　 Onload() 页面载入时触发

　　 Onunload() 页面关闭时触发

　　 B.16 images 数组

　　它是 document 对象的一个属性 , 文档中所有图像的列表。

　　属性

　　 length 文档内的图像个数

　　 B.17 link

　　它是 document 对象的一个属性 , 文档内的一个 <A HREF=> 标记。

　　属性

　　 hash 以散列号 (#) 开始的一个字符串 , 用于指定 URL 内的一个锚点

　　 host 包括冒号和端口号的 URL 的主机名部分

　　 hostname 与 host 属性相同 , 除了不包括冒号和端口号外

　　 href 完整的 URL

　　 pathname URL 的目录路径部分

　　 port URL 的 : 端口部分

　　 protocol URL 类型 (http: 、 ftp: 、 gopher: 等等 )

　　 search 以一个问号开始的 URL 中的一部分 , 用于指定搜索信息

　　 target 当用户单击一链接 (TARGET 特性 ) 时 , 用于显示被引用文档内容的窗口

　　事件处理程序

　　 Onclick 点击

　　 Onmouseover 鼠标移到对象上

　　 B.18 links 数组

　　它是 document 对象的一个属性 , 文档内所有链接的一个列表。

　　属性

　　 length 文档内的链接数

　　 B.19 location 对象

　　它为 document 对象的一个属性 , 该文档的完整 URL ，请不要把它与 window.location 属性相混淆 , 后者可用来加载一个新文档 , 并且 window.location 属性本身并不是一个对象，同时 ,window.location 可以用脚本修改 , 而 document.location 则不能。

　　属性

　　 hash 以散列号 (#) 开始的一个字符串 , 用于指定 URL 内的一个锚点

　　 host 包括冒号和端口号的 URL 的主机名部分

　　 hostname 与 host 属性相同 , 除了不包括冒号和端口号之外

　　 href 完整的 URL

　　 pathname URL 的目录路径部分

　　 port URL 的 : 端口部分

　　 protocol URL 的类型 (http: 、 ftp: 、 gopher: 等等 )

　　 search 以问号 (?) 开始的 URL 中的一部分 , 用于指定搜索信息

　　 target 用户单击链接 (TARGET 特性 ) 时 , 用于显示被引用文档的内容的窗口

　　 B.20 math 对象

　　该对象不是其它对象的一个属性 , 而是一个内置对象 , 包含了许多数学常量和函数。

　　属性

　　 E 欧拉常量 , 自然对数的底 ( 约等于 2.718)

　　 LN2 2 的自然对数 ( 约等于 0.693)

　　 LN10 10 的自然对数 ( 约等于 2.302)

　　 LOG2E 以 2 为底的 e 的对数 ( 约等于 1.442)

　　 LOG10E 以 10 为底的 e 的对数 ( 约等于 o.434)

　　 PI ∏的值 ( 约等于 3.14159)

　　 SQRT1_2 0.5 的平方根 ( 即 l 除以 2 的平方根 , 约等于 o.707)

　　 SQRT2 2 的平方根 ( 约等于 1.414)

　　方法

　　 abs() 返回某数的绝对值 ( 即该数与 o 的距离 , 例如 ,2 与一 2 的绝对值都是 2)

　　 acos() 返回某数的反余弦值 ( 以弧度为单位 )

　　 asin() 返回某数的反正弦值 ( 以弧度为单位 )

　　 atan() 返回某数的反正切值 ( 以弧度为单位 )

　　 ceil() 返回与某数相等 , 或大于该数的最小整数 (ceil(-22.22) 返回 -22;ceil22,22) 返回 23;ceil(22) 返回 22)

　　 cos() 返回某数 ( 以弧度为单位 ) 的余弦值

　　 exp() 返回 en

　　 floor() 与 ceil 相反 (floor( 一 22.22) 返回一 23;floor(22.22) 返回 22; floor(22) 返回 22)

　　 10g () 返回某数的自然对数 ( 以 e 为底 )

　　 max() 返回两数间的较大值

　　 min() 返回两数问的较小值

　　 pow() 返回 m 的 n 次方 ( 其中 ,m 为底 ,n 为指数 )

　　 random() 返回 0 和 1 之间的一个伪随机数 ( 该方法仅在 Netscape

　　 Navigator 的 UNIX 版本中有效 )

　　 round() 返回某数四舍五入之后的整数

　　 sin() 返回某数 ( 以弧度为单位 ) 的正弦值

　　 sqrt() 返回某数的平方根

　　 tan() 返回某数的正切值

　　 B.2l navigator 对象

　　该对象不是其它对象的属性 , 而是一个内置对象它包含了有关加载文档的浏览器的信息。

　　属性

　　 appCodeName 浏览器的代码名 ( 例如 ,Mozilla)

　　 appName 浏览器的名字

　　 appVersion 浏览器的版本号

　　 userAgent 由客户机送到服务器的用户与代理头标文本

　　方法

　　 javaEnabled JavaScript 中当前并没有该方法 , 但是不久之后将会添加上它将查看浏览器是否为兼容 JavaScript 的浏览器 , 如果是 , 继续查看 JavaScript 是否处于支持状态。

　　 B.22 options 数组

　　该数组是 select 对象的一个属性 , 即选择框中的所有选项 (<OPTION>) 的一个列表。

　　属性

　　 defaultSelected 选项列表中的缺省选项

　　 index 选项列表中某选项的索引位置

　　 length 选项列表中的选项数 (<OPTIONS>)

　　 name 选项列表的名字 (NAME 特性 )

　　 selected 表示选项列表中某选项 <OPTION> 是否被选中的一个布尔类型值

　　 selectedIndex 选项列表中已选中的 <OPTION> 的索引 ( 位置 )

　　 text 选项列表中 <OPTION> 标记后的文本

　　 value 选项列表中的 VALUE= 特性

　　 B.23 Password 对象

　　它是 document 对象的一个属性 , 一个 <INPUT TYPE= ” PASSWORD ” > 标记。

　　属性

　　 defaultValue password 对象的缺省值 (VAlUE= 特性 )

　　 name 对象的名字 (NAME= 特性 )

　　 value 该域具有的当前值最初与 VALUE= 特性 (defauttValue) 相同 , 但是 , 如果脚本修改了该域中的值 , 则该值将改变

　　方法

　　 focus 把焦点从该域移开

　　 blur 把焦点移到该域

　　 select 选择输入区域

　　 B.24 radio 对象

　　它是 form 对象的一个属性 , 窗体内的一组单选按钮 ( 选项按钮 )(<INPUT TYPE= ” RADIO ” >) 。

　　属性

　　 checked 复选框或选项按钮 ( 单选按钮 ) 的状态

　　 defaultChecked 复选框或选项按钮 ( 单选按钮 ) 的缺省状态

　　 length 一组单选按钮中的按钮数

　　 name 对象的名字 (NAME= 特性 )

　　 value VALUE= 特性

　　方法

　　 click 模拟鼠标单击按钮

　　事件处理程序

　　 onclick 点击

　　 B.25 reset 对象

　　它是 form 对象的一个属性 , 复位按钮 (<INPUT TYPE= ” RESET ” >) 。

　　属性

　　 name 对象的名字 (NAME= 特性 )

　　 value VALUE= 特性

　　方法

　　 click 模拟鼠标单击按钮

　　事件处理程序

　　 onclick 点击

　　 B.26 select 对象

　　它是 form 对象的一个属性 , 选择框 (<SELECT>) 。

　　属性

　　 length 选项列表中的选项数 (<OPTIONS>)

　　 name 选项列表的名字 (NAME 特性 )

　　 options 列表中的选项数

　　 selectedlndex 选项列表中已选中的 <OPTION> 的索引 ( 位置 )

　　 text 选项列表中 (OPTION) 标记之后的文本

　　 value 选项列表中的 VALUE= 特性

　　方法

　　 blur 把焦点从选项列表中移走

　　 focus 把焦点移到选项列表中

　　事件处理程序

　　 Onblur 失去焦点时事件

　　 onchange 更改

　　 Onfocus 聚焦事件

本文列举了各种 JavaScript 对象与数组 , 同时包括对上述每一对象或数组所完成工作的简短描述 , 以及与其相关的属性方法 , 以及事件处理程序 , 还注明了该对象或数组的父对象用户同样可能需要参考 Online Companion 中的超级文本 Object Hierarchy 页面 (http://www.netscapepress.com/support/javascript/10-9.htm), 以便了解这些对象之间是如何相互关联的。

　　顺便提一下 , 记住 , 这里把所有作为另一对象的子对象的对象看作该对象的属性请参见第十章中与此相关的注解。

　　 B.1 anchor 对象

　　使用 <A NAME=> 标记创建的 HTML 描点能被一个链接作为目标如果锚点包括 HREF= 特性 , 则它也是一个链接对象。

　　 anchor 对象是 document 对象的一个属性 , 它本身没有属性方法或者事件处理程序。

　　 B.2 anchors 数组

　　 anchors 数组是 document 对象的一个属性 , 是文档内所有 anchor 对象的一个列表如果 anchor 也是一个 link( 链接 ), 则它会同时出现在 anchors 和 links 数组中。

　　属性

　　 length 文档内的锚点个数

　　 B.3 array 对象

　　 array 对象是 Netscape Navlgator 3.0 beta 3 中引入的一个新的对象 , 因而 , 它不能在 Netscape 2.0 中使用它是一个内置对象 , 而不是其它对象的属性。

　　属性

　 length 数组中的值个数

　　 B.4 button 对象

　　它是 form 对象的一个属性 , 使用 <INPUT TYPE="BUTTON"> 标记来创建。

　　属性

　　 name HTML 标记中的 NAME= 特性

　　 value HTML 标记中的 VALUE= 特性

　　方法

　　 click 模拟鼠标单击一按钮

　　事件处理程序

　　 Onclick

　　 B.5 checkbox 对象

　　它是 form 对象的一个属性 , 使用 <INPUT TYPE="CHECKBOX"> 标记来创建。

　　属性

　　 checked 复选框的选择状态

　　 defaultChecked 标记的 CHECKED= 特性

　　 name 标记的 NAME= 特性

　　 value 标记的 VALUE= 特性

　　方法

　　 click 模拟鼠标单击按钮

　　事件处理程序

　　 onclick

　　 B.6 Date 对象

　　它是一个内置对象——而不是其它对象的属性 , 允许用户执行各种使用日期和时间的过程。

　方法

　　 getDate() 查看 Date 对象并返回日期

　　 getDay() 返回星期几

　　 getHours() 返回小时数

　　 getMinutes() 返回分钟数

　　 getMonth() 返回月份值

　　 getSeconds() 返回秒数

　　 getTime() 返回完整的时间

　　 getTimezoneoffset() 返回时区偏差值 ( 格林威治平均时间与运行脚本的计算机所处时区设置之间相差的小时数 )

　　 getYear() 返回年份

　　 parse() 返回在 Date 字符串中自从 1970 年 1 月 1 日 00:00:00 以来的毫秒数 (Date 对象按照毫秒数的形式存储从那时起的日期和时间 ) 但是注意 , 该方法当前不能正确运行

　　 setDate() 改变 Date 对象的日期

　　 setHours() 改变小时数

　　 setMinutes() 改变分钟数

　　 setMonth() 改变月份

　　 setSeconds() 改变秒数

　　 setTime() 改变完整的时间

　　 setYear() 改变年份

　　 toGMTString() 把 Date 对象的日期 ( 一个数值 ) 转变成一个 GMT 时间字符串 , 返回类似下面的值 :Weds,15 June l997 14:02:02 GMT( 精确的格式依赖于计算机上所运行的操作系统而变 )

　　 toLocaleString() 把 Date 对象的日期 ( 一个数值 ) 转变成一个字符串 , 使用所在计算机上配置使用的特定日期格式

　　 UTC() 使用 Date UTC( 年、月、日、时、分、秒 ), 以自从 1970 年 1 月 1 日 00:00:00( 其中时、分、秒是可选的 ) 以来的毫秒数的形式返回日期

　　 B.7 document 对象

　　该对象是 window 和 frames 对象的一个属性 , 是显示于窗口或框架内的一个文档。

　　属性

　　 alinkColor 活动链接的颜色 (ALINK)

　　 anchor 一个 HTMI 锚点 , 使用 <A NAME=> 标记创建 ( 该属性本身也是一个对象 )

　　 anchors array 列出文档锚点对象的数组 (<A NAME=>)( 该属性本身也是一个对象 )

　　 bgColor 文档的背景颜色 (BGCOLOR)

　　 cookie 存储于 cookie.txt 文件内的一段信息 , 它是该文档对象的一个属性

　　 fgColor 文档的文本颜色 (<BODY> 标记里的 TEXT 特性 )

　　 form 文档中的一个窗体 (<FORM>)( 该属性本身也是一个对象 )

　　 forms anay 按照其出现在文档中的顺序列出窗体对象的一个数组 ( 该属性本身也是一个对象 )

　　 lastModified 文档最后的修改日期

　　 linkColor 文档的链接的颜色 , 即 <BODY> 标记中的 LINK 特性 ( 链接到用户没有观察到的文档 )

　　 link 文档中的一个 <A HREF=> 标记 ( 该属性本身也是一个对象 )

　　 links array 文档中 link 对象的一个数组 , 按照它们出现在文档中的顺序排列 ( 该属性本身也是一个对象 )

　　 location 当前显示文档的 URL 。用户不能改变 document.location( 因为这是当前显示文档的位置 ) 。但是 , 可以改变 window.location ( 用其它文档取代当前文档 )window.location 本身也是一个对象 , 而 document.location 不是对象

　　 referrer 包含链接的文档的 URL, 用户单击该链接可到达当前文档

　　 title 文档的标题 ((TITLE>)

　　 vlinkColor 指向用户已观察过的文档的链接文本颜色 , 即 <BODY> 标记的 VLINK 特性

　　方法

　　 clear 清除指定文档的内容

　　 close 关闭文档流

　　 open 打开文档流

　　 write 把文本写入文档

　　 writeln 把文本写入文档 , 并以换行符结尾

　　 B.8 elements 数组

　　它是 form 对象的一个属性 , 列举了窗体内各元素的一个数组。

　　属性

　　 1ength 窗体内的元素个数

　　 B.9 form 对象

　　它是 document 对象的一个属性 , 文档内的一个窗体。

　　属性

　　 action 包含了为一个窗体提交的目标 URL 的字符串

　　 button 窗体内的一个按钮 , 使用 <INPUT TYPE= ” BUTTON ” > 标记来创建 ( 该属性本身也是一个对象 )

　　 checkbox 复选框 , 使用 <INPUT TYPE= ” CHECKBOX ” > 标记来创建 ( 该属性本身也是一个对象 )

　　 elements array 一个数组 , 按照其出现于窗体内的顺序列举各窗体元素 ( 该属性本身也是一个对象 )

　　 encoding 窗体的 MIME 编码

　 hidden 窗体里的一个隐藏元素 (<INPUT TYPE= ” HIDDEN ” >) 。窗体对象的一个属性 ( 该属性本身也是一个对象 )

　　 length 窗体里的元素的个数

　　 method 输入窗体的数据传送到服务器上的方式 , 即 (FORM) 标记中的 METHOD 特性

　　 radio 设置在窗体里的单选按钮 (<INPUT TYPE= ” RADIO ” >)( 该属性本身也是一个对象 )

　　 reset 窗体里的复位按钮 ((1NPUT TYPE= ” RESET ” >)( 该属性自身也是一个对象 )

　　 select 窗体里的选择框 (<SELECT>)( 该属性本身也是一个对象 )

　　 submit 窗体里的提交按钮 (<INPUT TYPE= ” SUBMIT ” >)( 该属性本身也是一个对象 )

　　 target 提交窗体后 , 显示回应信息的窗口的名字

　　 text 窗体里的文本元素 (<INPUT TYPE= ” TEXT ” >)( 该属性本身也是一个对象 )

　　 textarta 窗体里的文本区元素 (<TEXTAREA>)( 该属性本身也是一个对象 )

　　方法

　　 submit 提交窗体 ( 与使用 Submit 按钮的作用相同 ) 事件处理程序

　　 onsubmit

　　 B.10 forms 数组

　　该数组是 document 对象的一个属性 , 即列举了文档内的各窗体的一个数组。

　　属性

　　 length 文档内窗体的个数

　　 B.11 frame 对象

　　它是 window 对象的一个属性 , 窗口内的一个框架。除了个别例外 ,frame 对象与 window 对象的作用相同。

　　属性

　　 frames array 列举该框架内的各个子框架的一个数组 ( 该属性本身也是—个对象 )

　　 length 该框架内的框架数

　　 name 框架的名字 (<FRAME> 标记里的 NAME 特性 )

　　 parent 包含本框架的父窗口的同义词

　　 self 当前框架的同义词

　　 window 当前框架的同义词

　　方法

　　 clearTimeout() 用来终止 setTimeout 方法的工作

　　 setTimeout() 等待指定的毫秒数 , 然后运行指令

　　 B.12 frames 数组

　　它既是 window 对象 , 也是 frame 对象的属性 , 列举了 window 或者 frame 对象内的各框架。

　　属性

　　 length 窗口或框架对象内的框架数

　　 B.13 hidden 对象

　　糊为 form 对象的一个属性 , 窗体内的一个隐藏元素 (<INPUT TYPE= ” HIDDEN ” >) 。

　　属性

　　 name 标记内的名字 (NAME 特性 )

　　 value 标记内的 VALUE= 特性

　　 B.14 history 对象

　　它为 window 对象的一个属性 , 该窗口的历史列表。

　　属性

　　 length 历史列表中的项目数

　　方法

　　 back 加载历史列表中的上一个文档

　　 forward 加载历史列表中的下一个文档

　　 go 加载历史列表中的一个指定文档 , 通过文档在列表中的位置来指定

　　 B.15 image 对象

　　它是 document 对象的一个属性 , 是使用 (1MG) 标记内嵌入文档里的一幅图像这是 Netscape Navigator 3.0 beta 3 引入的新对象。

　　属性

　　 border <IMG> 标记的 BORDER 特性

　　 complete 表示浏览器是否完整地加载了图像的一个布尔值

　　 height HEIGHT 特性

　　 hspace HSPACE 特性

　　 lowsrc LOWSRC 特性

　　 src SRC 特性

　　 vsPace VSPACE 特性

　　 width WIDTH 特性

　　事件处理程序

　　 Onload 图象载入

　　 Onerror 载入错误

　　 Onabort 取消

javascript 事件列表解说

事件浏览器支持解说

一般事件

onclick IE3 、 N2 鼠标点击时触发此事件

ondblclick IE4 、 N4 鼠标双击时触发此事件

IE4 、 N4 按下鼠标时触发此事件

IE4 、 N4 鼠标按下后松开鼠标时触发此事件

IE3 、 N2 当鼠标移动到某对象范围的上方时触发此事件

IE4 、 N4 鼠标移动时触发此事件

IE4 、 N3 当鼠标离开某对象范围时触发此事件

onkeypress IE4 、 N4 当键盘上的某个键被按下并且释放时触发此事件 .

onkeydown IE4 、 N4 当键盘上某个按键被按下时触发此事件

onkeyup IE4 、 N4 当键盘上某个按键被按放开时触发此事件

页面相关事件

onabort IE4 、 N3 图片在下载时被用户中断

onbeforeunload IE4 、 N 当前页面的内容将要被改变时触发此事件

onerror IE4 、 N3 出现错误时触发此事件

onload IE3 、 N2 页面内容完成时触发此事件

onmove IE 、 N4 浏览器的窗口被移动时触发此事件

onresize IE4 、 N4 当浏览器的窗口大小被改变时触发此事件

onscroll IE4 、 N 浏览器的滚动条位置发生变化时触发此事件

onstop IE5 、 N 浏览器的停止按钮被按下时触发此事件或者正在下载的文件被中断

onunload IE3 、 N2 当前页面将被改变时触发此事件

表单相关事件

onblur IE3 、 N2 当前元素失去焦点时触发此事件

onchange IE3 、 N2 当前元素失去焦点并且元素的内容发生改变而触发此事件

onfocus IE3 、 N2 当某个元素获得焦点时触发此事件

onreset IE4 、 N3 当表单中 RESET 的属性被激发时触发此事件

onsubmit IE3 、 N2 一个表单被递交时触发此事件

滚动字幕事件

onbounce IE4 、 N 在 Marquee 内的内容移动至 Marquee 显示范围之外时触发此事件

onfinish IE4 、 N 当 Marquee 元素完成需要显示的内容后触发此事件

onstart IE4 、 N 当 Marquee 元素开始显示内容时触发此事件

编辑事件

onbeforecopy IE5 、 N 当页面当前的被选择内容将要复制到浏览者系统的剪贴板前触发此事件

onbeforecut IE5 、 N 当页面中的一部分或者全部的内容将被移离当前页面 [ 剪贴 ] 并移动到浏览者的系统

剪贴板时触发此事件

onbeforeeditfocus IE5 、 N 当前元素将要进入编辑状态

onbeforepaste IE5 、 N 内容将要从浏览者的系统剪贴板传送 [ 粘贴 ] 到页面中时触发此事件

onbeforeupdate IE5 、 N 当浏览者粘贴系统剪贴板中的内容时通知目标对象

oncontextmenu IE5 、 N 当浏览者按下鼠标右键出现菜单时或者通过键盘的按键触发页面菜单时触发的事件

oncopy IE5 、 N 当页面当前的被选择内容被复制后触发此事件

oncut IE5 、 N 当页面当前的被选择内容被剪切时触发此事件

ondrag IE5 、 N 当某个对象被拖动时触发此事件 [ 活动事件 ]

ondragdrop IE 、 N4 一个外部对象被鼠标拖进当前窗口或者帧

ondragend IE5 、 N 当鼠标拖动结束时触发此事件，即鼠标的按钮被释放了

ondragenter IE5 、 N 当对象被鼠标拖动的对象进入其容器范围内时触发此事件

ondragleave IE5 、 N 当对象被鼠标拖动的对象离开其容器范围内时触发此事件

ondragover IE5 、 N 当某被拖动的对象在另一对象容器范围内拖动时触发此事件

ondragstart IE4 、 N 当某对象将被拖动时触发此事件

ondrop IE5 、 N 在一个拖动过程中，释放鼠标键时触发此事件

onlosecapture IE5 、 N 当元素失去鼠标移动所形成的选择焦点时触发此事件

onpaste IE5 、 N 当内容被粘贴时触发此事件

onselect IE4 、 N 当文本内容被选择时的事件

onselectstart IE4 、 N 当文本内容选择将开始发生时触发的事件

数据绑定

onafterupdate IE4 、 N 当数据完成由数据源到对象的传送时触发此事件

oncellchange IE5 、 N 当数据来源发生变化时

ondataavailable IE4 、 N 当数据接收完成时触发事件

ondatasetchanged IE4 、 N 数据在数据源发生变化时触发的事件

ondatasetcomplete IE4 、 N 当来子数据源的全部有效数据读取完毕时触发此事件

onerrorupdate IE4 、 N 当使用 onBeforeUpdate 事件触发取消了数据传送时，代替 onAfterUpdate 事件

onrowenter IE5 、 N 当前数据源的数据发生变化并且有新的有效数据时触发的事件

onrowexit IE5 、 N 当前数据源的数据将要发生变化时触发的事件

onrowsdelete IE5 、 N 当前数据记录将被删除时触发此事件

onrowsinserted IE5 、 N 当前数据源将要插入新数据记录时触发此事件

外部事件

onafterprint IE5 、 N 当文档被打印后触发此事件

onbeforeprint IE5 、 N 当文档即将打印时触发此事件

onfilterchange IE4 、 N 当某个对象的滤镜效果发生变化时触发的事件

onhelp IE4 、 N 当浏览者按下 F1 或者浏览器的帮助选择时触发此事件

onpropertychange IE5 、 N 当对象的属性之一发生变化时触发此事件

onreadystatechange IE4 、 N 当对象的初始化属性值发生变化时触发此事件

38. 页面进入和退出的特效

进入页面 <meta http-equiv="Page-Enter" content="revealTrans(duration=x, transition=y)">

推出页面 <meta http-equiv="Page-Exit" content="revealTrans(duration=x, transition=y)">

这个是页面被载入和调出时的一些特效。 duration 表示特效的持续时间，以秒为单位。 transition 表示使

用哪种特效，取值为 1-23:

　　 0 矩形缩小

　　 1 矩形扩大

　　 2 圆形缩小

　　 3 圆形扩大

　　 4 下到上刷新

　　 5 上到下刷新

　　 6 左到右刷新

　　 7 右到左刷新

　　 8 竖百叶窗

　　 9 横百叶窗

　　 10 错位横百叶窗

　　 11 错位竖百叶窗

　　 12 点扩散

　　 13 左右到中间刷新

　　 14 中间到左右刷新

　　 15 中间到上下

　　 16 上下到中间

　　 17 右下到左上

　　 18 右上到左下

　　 19 左上到右下

　　 20 左下到右上

　　 21 横条

　　 22 竖条

　　 23 以上 22 种随机选择一种

39. 在规定时间内跳转

40. 网页是否被检索

　　其中属性值有以下一些 :

　　属性值为 "all": 文件将被检索，且页上链接可被查询；

　　属性值为 "none": 文件不被检索，而且不查询页上的链接；

　　属性值为 "index": 文件将被检索；

　　属性值为 "follow": 查询页上的链接；

　　属性值为 "noindex": 文件不检索，但可被查询链接；

　　属性值为 "nofollow": 文件不被检索，但可查询页上的链接。

网页常用小技巧

1. oncontextmenu="window.event.returnValue=false" 将彻底屏蔽鼠标右键

<table border oncontextmenu=return(false)><td>no</table> 可用于 Table

2. <body onselectstart="return false"> 取消选取、防止复制

3. onpaste="return false" 不准粘贴

4. oncopy="return false;" oncut="return false;" 防止复制

5. <link rel="Shortcut Icon" href="favicon.ico"> IE 地址栏前换成自己的图标

6. <link rel="Bookmark" href="favicon.ico"> 可以在收藏夹中显示出你的图标

7. <input style="ime-mode:disabled"> 关闭输入法

8. 永远都会带着框架

if (window == top)top.location.href="frames.htm"; //frames.htm 为框架网页

// --></script>

9. 防止被人 frame

<SCRIPT LANGUAGE=JAVASCRIPT><!--

if (top.location != self.location)top.location=self.location;

// --></SCRIPT>

10. 网页将不能被另存为

11. <input type=button value= 查看网页源代码

onclick="window.location = "view-source:"+ "http://www.51js.com/"">

12. 删除时确认

13. 取得控件的绝对位置

//Javascript

function getIE(e){

var t=e.offsetTop;

var l=e.offsetLeft;

while(e=e.offsetParent){

t+=e.offsetTop;

l+=e.offsetLeft;

}

alert("top="+t+"/nleft="+l);

}

</script>

//VBScript

function getIE()

dim t,l,a,b

set a=document.all.img1

t=document.all.img1.offsetTop

l=document.all.img1.offsetLeft

while a.tagName<>"BODY"

set a = a.offsetParent

t=t+a.offsetTop

l=l+a.offsetLeft

wend

msgbox "top="&t&chr(13)&"left="&l,64," 得到控件的位置 "

end function

--></script>

14. 光标是停在文本框文字的最后

function cc()

{

var e = event.srcElement;

var r =e.createTextRange();

r.moveStart("character",e.value.length);

r.collapse(true);

r.select();

}

</script>

15. 判断上一页的来源

javascript:

document.referrer

16. 最小化、最大化、关闭窗口

本例适用于 IE

17. 屏蔽功能键 Shift,Alt,Ctrl

function look(){

if(event.shiftKey)

alert(" 禁止按 Shift 键 !"); // 可以换成 ALT 　 CTRL

}

document.onkeydown=look;

</script>

18. 网页不会被缓存

或者 <META HTTP-EQUIV="expires" CONTENT="0">

19. 怎样让表单没有凹凸感？

或

<input type=text style="border-left:none; border-right:none; border-top:none; border-bottom:

1 solid #000000"></textarea>

20.<div><span>&<layer> 的区别？

<div>(division) 用来定义大段的页面元素，会产生转行

<span> 用来定义同一行内的元素，跟 <div> 的唯一区别是不产生转行

21. 让弹出窗口总是在最上面 :

22. 不要滚动条 ?

让竖条没有 :

</body>

让横条没有 :

</body>

两个都去掉？更简单了

</body>

23. 怎样去掉图片链接点击后，图片周围的虚线？

24. 电子邮件处理提交表单

</form>

25. 在打开的子窗口刷新父窗口的代码里如何写？

window.opener.location.reload()

26. 如何设定打开页面的大小

打开页面的位置 <body onload="top.moveBy(300,200);">

27. 在页面中如何加入不是满铺的背景图片 , 拉动页面时背景图不动

<STYLE>

body

{background-image:url(logo.gif); background-repeat:no-repeat;

background-position:center;background-attachment: fixed}

</STYLE>

28. 检查一段字符串是否全由数字组成

function checkNum(str){return str.match(//D/)==null}

alert(checkNum("1232142141"))

alert(checkNum("123214214a1"))

// --></script>

29. 获得一个窗口的大小

document.body.clientWidth; document.body.clientHeight

30. 怎么判断是否是字符

if (/[^/x00-/xff]/g.test(s)) alert(" 含有汉字 ");

else alert(" 全是字符 ");

31.TEXTAREA 自适应文字行数的多少

</textarea>

32. 日期减去天数等于第二个日期

function cc(dd,dadd)

{

// 可以加上错误处理

var a = new Date(dd)

a = a.valueOf()

a = a - dadd * 24 * 60 * 60 * 1000

a = new Date(a)

alert(a.getFullYear() + " 年 " + (a.getMonth() + 1) + " 月 " + a.getDate() + " 日 ")

}

cc("12/23/2002",2)

</script>

33. 选择了哪一个 Radio

function checkme()

for each ob in radio1

if ob.checked then window.alert ob.value

</script><BODY>

<INPUT name="radio1" type="radio" value="style" checked>Style

<INPUT name="radio1" type="radio" value="barcode">Barcode

</BODY></HTML>

34. 脚本永不出错

<!-- Hide

function killErrors() {

return true;

}

window.onerror = killErrors;

// -->

</SCRIPT>

35.ENTER 键可以让光标移到下一个输入框

36. 检测某个网站的链接速度：

把如下代码加入 <body> 区域中 :

tim=1

setInterval("tim++",100)

b=1

var autourl=new Array()

autourl[1]="www.njcatv.net"

autourl[2]="javacool.3322.net"

autourl[3]="www.sina.com.cn"

autourl[4]="www.nuaa.edu.cn"

autourl[5]="www.cctv.com"

function butt(){

document.write("<form name=autof>")

for(var i=1;i<autourl.length;i++)

document.write("<input type=text name=txt"+i+" size=10 value= 测试中…… > = 》 <input type=text

name=url"+i+" size=40> = 》 <input type=button value=GO

onclick=window.open(this.form.url"+i+".value)><br/>")

document.write("<input type=submit value= 刷新 ></form>")

}

butt()

function auto(url){

document.forms[0]["url"+b].value=url

if(tim>200)

{document.forms[0]["txt"+b].value=" 链接超时 "}

else

{document.forms[0]["txt"+b].value=" 时间 "+tim/10+" 秒 "}

b++

}

function run(){for(var i=1;i<autourl.length;i++)document.write("<img

src=http://"+autourl+"/"+Math.random()+" width=1 height=1

onerror=auto("http://"+autourl+"")>")}

run()</script>

37. 各种样式的光标

auto ：标准光标

default ：标准箭头

hand ：手形光标

wait ：等待光标

text ： I 形光标

vertical-text ：水平 I 形光标

no-drop ：不可拖动光标

not-allowed ：无效光标

help ： ? 帮助光标

all-scroll ：三角方向标

move ：移动标

crosshair ：十字标

e-resize

n-resize

nw-resize

w-resize

s-resize

se-resize

sw-resize

external.m2_blocked() 、 external.m2_blocked() 方法使用详解

javascript 有许多内建的方法来产生对话框，如： window.alert(),

window.confirm(),window.prompt(). 等。然而 IE 提供更多的方法支持对话框。如：

　　 external.m2_blocked() (IE 4+ 支持 )

　　 external.m2_blocked() (IE 5+ 支持 )

window.external.m2_blocked() 方法用来创建一个显示 HTML 内容的模态对话框，

由于是对话框，因此它并没有一般用 window.open() 打开的窗口的所有属性。

window.external.m2_blocked() 方法用来创建一个显示 HTML 内容的非模态对话框。

当我们用 external.m2_blocked() 打开窗口时，不必用 window.close() 去关闭它，

当以非模态方式 [IE5] 打开时，打开对话框的窗口仍可以进行其他的操作，即对话框

不总是最上面的焦点，当打开它的窗口ＵＲＬ改变时，它自动关闭。而模态 [ ＩＥ４ ]

方式的对话框始终有焦点（焦点不可移走，直到它关闭）。模态对话框和打开它的窗

口相联系，因此我们打开另外的窗口时，他们的链接关系依然保存，并且隐藏在活动

窗口的下面。

使用方法如下：

vReturnValue=window.external.m2_blocked(sURL [,vArguments] [,sFeatures])

参数说明：

sURL

必选参数，类型：字符串。用来指定对话框要显示的文档的 URL 。

vArguments

可选参数，类型：变体。用来向对话框传递参数。传递的参数类型不限，包括数组等。

对话框通过 window.dialogArguments 来取得传递进来的参数。

sFeatures

可选参数，类型：字符串。用来描述对话框的外观等信息，可以使用以下的一个或几个，

用分号“ ; ”隔开。

dialogHeight 对话框高度，不小于１００ px ，ＩＥ４中 dialogHeight 和 dialogWidth

默认的单位是 em ，而ＩＥ５中是 px ，为方便其见，在定义 modal 方式的对话框时，用 px

做单位。

　　 dialogWidth: 对话框宽度。

　　 dialogLeft: 距离桌面左的距离。

　　 dialogTop: 离桌面上的距离。

　　 center: {yes | no | 1 | 0 } ：窗口是否居中，默认 yes ，但仍可以指定高度和宽度。

　　 help: {yes | no | 1 | 0 } ：是否显示帮助按钮，默认 yes 。

　　 resizable: {yes | no | 1 | 0 } [ ＩＥ５＋ ] ：是否可被改变大小。默认 no 。

　　 status: {yes | no | 1 | 0 } [IE5+] ：是否显示状态栏。默认为 yes[ Modeless]

或 no[Modal] 。

scroll:{ yes | no | 1 | 0 | on | off } ：指明对话框是否显示滚动条。默认为 yes 。

还有几个属性是用在 HTA 中的，在一般的网页中一般不使用。

dialogHide:{ yes | no | 1 | 0 | on | off } ：在打印或者打印预览时对话框是否隐藏。

默认为 no 。

edge:{ sunken | raised } ：指明对话框的边框样式。默认为 raised 。

unadorned:{ yes | no | 1 | 0 | on | off } ：默认为 no 。

传入参数：

要想对话框传递参数，是通过 vArguments 来进行传递的。类型不限制，对于字符串类型，

最大为 4096 个字符。也可以传递对象，例如：

test1.htm

====================

var mxh1 = new Array("mxh","net_lover"," 孟子 E 章 ")

var mxh2 = window.open("about:blank","window_mxh")

// 向对话框传递数组

window.external.m2_blocked("test2.htm",mxh1)

// 向对话框传递 window 对象

window.external.m2_blocked("test3.htm",mxh2)

</script>

test2.htm

====================

var a = window.dialogArguments

alert(" 您传递的参数为： " + a)

</script>

test3.htm

====================

var a = window.dialogArguments

alert(" 您传递的参数为 window 对象，名称： " + a.name)

</script>

可以通过 window.returnValue 向打开对话框的窗口返回信息，当然也可以是对象。

例如：

test4.htm

===================

var a = window.external.m2_blocked("test5.htm")

for(i=0;i<a.length;i++) alert(a[i])

</script>

test5.htm

===================

function sendTo()

{

var a=new Array("a","b")

window.returnValue = a

window.close()

}

</script>

<body>

<form>

<input value=" 返回 " type=button

</form>

常见问题：

1 ，如何在模态对话框中进行提交而不新开窗口？

如果你的浏览器是 IE5.5+, 可以在对话框中使用带 name 属性的 iframe ，提交时可以

制定 target 为该 iframe 的 name 。对于 IE4+ ，你可以用高度为 0 的 frame 来作：例子，

test6.htm

===================

window.external.m2_blocked("test7.htm")

</script>

test7.htm

===================

if(window.location.search) alert(window.location.search)

</frameset>

test8.htm

===================

</form>

if(window.location.search) alert(window.location.search)

</script>

2, 可以通过 http://servername/virtualdirname/test.htm?name=mxh 方式直接向

对话框传递参数吗？

答案是不能。但在 frame 里是可以的。

file:// 屏蔽 F5 刷新键

function document.onkeydown()

{

var k = window.event.keyCode;

if (k == 116) file:// 屏蔽 F5 刷新键

{

window.event.keyCode = 0;

window.event.returnValue= false;

}

file:// 屏蔽鼠标右键、 Ctrl+N 、 Shift+F10 、 F5 刷新、退格键

file:// 屏蔽 F1 帮助

function window.onhelp()

{

return false

}

function KeyDown()

{

file://alert(event.keyCode);

file:// 屏蔽 Alt+ 方向键 ← 屏蔽 Alt+ 方向键 →

if ((window.event.altKey)&&((window.event.keyCode==37)||

(window.event.keyCode==39)))

{

file://alert(" 不准你使用 ALT+ 方向键前进或后退网页！ ");

event.returnValue=false;

}

file:// 屏蔽退格删除键 , 屏蔽 F5 刷新键 ,Ctrl + R

if ((event.keyCode==116)||(event.ctrlKey && event.keyCode==82))

{

event.keyCode=0;

event.returnValue=false;

}

file:// 屏蔽 Ctrl+n

if ((event.ctrlKey)&&(event.keyCode==78))

{

event.returnValue=false;

}

file:// 屏蔽 shift+F10

if ((event.shiftKey)&&(event.keyCode==121))

{

event.returnValue=false;

}

file:// 屏蔽 shift 加鼠标左键新开一网页

if (window.event.srcElement.tagName == "A" && window.event.shiftKey)

{

window.event.returnValue = false;

}

file:// 屏蔽 Alt+F4

if ((window.event.altKey)&&(window.event.keyCode==115))

{

window.external.m2_blocked("about:blank","","dialogWidth:1px;dialogheight:1px");

return false;

}

file:// 屏蔽 Ctrl+A

if((event.ctrlKey)&&(event.keyCode==65))

{

return false;

}

</script>

</body>

</HTML>

一些搜集的 WEB 技术小窍门

如何在 HTML 文件中包含某个 HTML 文件？

方法一：

在 html 页面 include 其它页面

<IE:Download ID="oDownload" STYLE="behavior:url(#default#download)" />

function onDownloadDone(downDate)

{

document.all.showImport.innerHTML=downDate; // 这种方法被讨论出来是最好的

}

//--></script>

方法二：

=0>

</object>

----------------------------------------------------------------------------------------------------------------------------

-------------------------------------------

TextBox 里加入图片？

大家好！

这里是一个图片

</TEXTAREA>

<!--

var img = document.createElement("IMG");

img.src="http://community.csdn.net/images/csdn.gif";

window.textarea1.appendChild(img);

//-->

</SCRIPT>

全屏技术：

真正的全屏页面解决之道！（全代码）

真正全屏解决之道：

1.htm

<html>

<head>

<title> 无标题文档 </title>

</head>

</body>

</html>

fullscreen.htm

<html>

<head>

<title> 无标题文档 </title>

<!--

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 +'');

}

file://-->

<!--

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")')

}

file://-->

</script>

</head>

<div align="right"><a href="javascript:" onclick="window.close()"> 关闭

</a> </div>

<p></P>

<div align="right"><a href="javascript:" onclick="opensmallwin('login.htm')"> 登录

</a> </div>

<p></P>

<div align="center"><a href="javascript:"

onclick="modelesswin('login.htm',300,160)"> 用模态登录窗口 </a> </div>

</body>

</html>

login.htm

<html>

<head>

<!--

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></head>

<table width="100%" height="100%" border="0" cellpadding="0"

cellspacing="14" bgcolor="#CCCCCC">

<td width="90%"><input name="textfield1" type="text" size="25"

class="whiteline"></td>

</tr>

<td><input name="textfield12" type="password" size="25"

class="whiteline"></td>

</tr>

<td><input type="submit" name="Submit" value=" 登　　录 "

class="boxline"></td>

</tr>

</table>

</body>

</html>

自动关掉原窗口：

<html>

<head>

<title> 无标题文档 </title>

<!--

body {

margin-left: 0px;

margin-top: 0px;

margin-right: 0px;

margin-bottom: 0px;

}

-->

</style>

</head>

<body onload="window.open('fullscreen.htm','','fullscreen=1,scroll=no');

window.opener=null;window.close()">

<OBJECT id=WebBrowser classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2

height=0 width=0></OBJECT>

</body>

</html>

关键是在 onload 事件中加入：

window.opener=null;window.close()

预读图片：

<!-- 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 -->

</script>

关于两个网页刷新交互的问题

JS 处理方法：

a.htm

alert("wwwwwwwwwwwwwwwwwwwwwwwwww");

</script>

b.htm

file://window.opener.location.reload(); 刷新父窗口

file://window.opener.location="2.htm"// 重定向父窗口到 2.htm 页

function closewindow()

{

window.opener.location.reload();

self.close();

window.opener.document.write("sssssssssssssssssss");

}

</script>

后台处理方法：

private btnForSubmit(Object sender,EventArgs e)

{

.............

Response.Write("<script>window.opener.document.execCommand('refresh');

window.opener='';window.close();</script>");

file://string str="<script>window.opener.document.execCommand('refresh');

window.opener='';window.close();</script>";

file://this.RegisterStartupScript("mycode",str);

BS 开发中常用的 javascript 技术

4 、事件类

4.1 屏蔽右键

在 body 标签里加上 oncontextmenu=self.event.returnValue=false

4.2 屏蔽所有功能键

4.3 --> 和 <-- F5 F11,F9,F1

4.4 屏蔽组合键 ctrl+N

function KeyDown(){

if ((window.event.altKey)&&

((window.event.keyCode==37)|| file:// 屏蔽 Alt+ 方向键 ←

(window.event.keyCode==39))){ file:// 屏蔽 Alt+ 方向键 →

alert(" 不准你使用 ALT+ 方向键前进或后退网页！ ");

event.returnValue=false;

}

if ((event.keyCode==8)|| file:// 屏蔽退格删除键

(event.keyCode==116)){ file:// 屏蔽 F5 刷新键

event.keyCode=0;

event.returnValue=false;

}

if ((event.ctrlKey)&&(event.keyCode==78)){ file:// 屏蔽 Ctrl+n

event.returnValue=false;

}

if ((event.shiftKey)&&(event.keyCode==121)){ file:// 屏蔽 shift+F10

event.returnValue=false;

}

if (event.keyCode==122){ file:// 屏蔽 F11

event.returnValue=false;

}

只要知道 keyCode 即可屏蔽所有功能键

一、验证类

1 、数字验证内

1.1 整数

/^(-|\+)?\d+$/.test(str)

1.2 大于 0 的整数（用于传来的 ID 的验证 )

/^\d+$/.test(str)

1.3 负整数的验证

/^-\d+$/.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})$/);

if (a == null) {alert(' 输入的参数不是时间格式 '); 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})$/);

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})$/;

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 只有年和月。形如 (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 判断字符由字母和数字，下划线 , 点号组成 . 且开头的只能是下划线和字母

/^([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.1 email 的判断。

function ismail(mail)

{

return(new RegExp(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)

[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/).test(mail));

}

6.2 手机号码的验证

6.3 身份证的验证

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})$/);

else if (len == 18)

re = new RegExp(/^(\d{6})()?(\d{4})(\d{2})(\d{2})(\d{3})(\d)$/);

else {alert(" 输入的数字位数不对！ "); 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(" 输入的身份证号 "+ a[0] +" 里出生日期不对！ "); return false;}

}

return true;

}

3.7 复选框的全选，多选，全不选，反选

<input type=checkbox name=mm

<input type=checkbox name=mm2

</form>

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 文件上传过程中判断文件类型

不断地清空剪贴板 :

file:// 先复制一样东西，或者文本或者图片

if(clipboardData.getData("Text")||clipboardData.getData("HTML")||

clipboardData.getData("URL"))

{

alert(" 有效行为 ");

}

</script>

// 保护页面不被打印、复制，禁止 Mouse 各键

<SCRIPT LANGUAGE="JavaScript">wside=(window.sidebar)?true:false;

var w456=false;

function nrcie(){return false;};

function nrcns(e) { if(e.which==2||e.which==3) return false;

}if(document.layers) { document.captureEvents(Event.MOUSEDOWN);

document.onmousedown=nrcns;

}document.oncontextmenu=nrcie;

document.onselectstart=new Function("return false");

function nsel(){if((document.layers)||wside){var qwe= document.getSelection();

if(qwe!="") {window.find(" ")};

setTimeout("nsel()",20);

}}nsel();

function ccd(){clipboardData.clearData();

};

function cce(){ccd();

setTimeout("cce()",30);

};

cce();

</SCRIPT>

页面上关于定位和长度的几个属性 ( 原创 )

首先是页面定位，用 CSS

position ，这个下面有两个属性 absolute( 绝对定位 ) 和 relative( 相对定位 ) ，绝对定位是指相对浏览器的位置地位，而相对定位和其他元素的位置有关系，位置不固定。

以下可以看一个例子，看了之后就明白了

abc<br/>

<div style="position:relative;left:1;top:100;color:green">absolute positioning with the current element<br/><span style="position:absolute;left:0;top:0;">aaaaaaaaa</span></div>

<div style="color:red">absolute positioning with the body<br/><span style="position:absolute;left:0;top:0">bbbbbbbbbbb</span></div>

<div style="color:blue">relative positioning with the body<span style="position:relative;left:-12;top:0">ccccccccccc</span></div>

而有些 CSS 属性有时候需用 position:absolute 之后才有效，比如裁切的那个 CSS 等

接下来是一些元素的位置问题

就拿宽度来说

scrollwidth,clientwidth,offsetwidth

这些属性都可以用在 <body>,<div> 等元素

第一个是包括滚动条所有在内的长度，第二个和第三个差不多，第三个是包括工具栏，菜单栏，状态栏，滚动条宽度等在内的宽度，而第二个是去掉一些 cellpadding 等一些的额外的宽度。高度同这个，元素分别为

scrollheight,clientheight,offsetheight

接下来是鼠标的位置

可以用 event.clientX + document.body.scrollLeft 得到横的绝对位置

这里面 event.clientX 是相对屏幕的位置，而 document.body.scrollLeft 是网页被横向滚动条卷进去的宽度。

这里可以看一个例子，代码如下把这个方法写在 <body> 的 onmousemove 中，一目了然了。

<!--

function statusreport() {

var tempx = event.clientX + document.body.scrollLeft;

var tempy = event.clientY + document.body.scrollTop;

window.status=' 在整个页面中的 X, Y 坐标 : ('+tempx+', '+tempy+') ; 在当前窗口中的 X, Y 坐标 : ( '+event.clientX+', '+event.clientY +')';

}

//-->

</SCRIPT>

大梅的思路，我把他用到了判断数据提交的时候有没有重复记录上了

</form>

<!--

Array.prototype.unique = function()

{

var a = {}; for(var i=0; i<this.length; i++)

{

if(typeof a[this[i]] == "undefined")

a[this[i]] = 1;

}

this.length = 0;

for(var i in a)

this[this.length] = i;

return this;

}

function check()

{

var ArrText = [document.form1.a123.value,document.form1.b123.value,document.form1.c123.value,document.form1.d123.value,document.form1.e123.value];

OldArr=ArrText.length;

NewArr=ArrText.unique().length;

if(OldArr==NewArr)

{

alert(" 无重复记录 ");

}

else

{

alert(" 有重复记录 ");

}

//-->

</SCRIPT>

Date.prototype.Format = function(format)

{

var o = {

"M+" : this.getMonth()+1, //month

"d+" : this.getDate(), //day

"h+" : this.getHours(), //hour

"m+" : this.getMinutes(), //minute

"s+" : this.getSeconds(), //second

"q+" : Math.floor((this.getMonth()+3)/3), //quarter

"S" : this.getMilliseconds() //millisecond

}

if(/(y+)/.test(format)) format=format.replace(RegExp.$1,

(this.getFullYear()+"").substr(4 - RegExp.$1.length));

for(var k in o)if(new RegExp("("+ k +")").test(format))

format = format.replace(RegExp.$1,

RegExp.$1.length==1 ? o[k] :

("00"+ o[k]).substr((""+ o[k]).length));

return format;

};

示例：

alert(new Date().Format("yyyy 年 MM 月 dd 日 "));

alert(new Date().Format("MM/dd/yyyy"));

alert(new Date().Format("yyyyMMdd"));

alert(new Date().Format("yyyy-MM-dd hh:mm:ss"));

http://jkisjk.vip.sina.com/html/

空间已经过期

代码无法更新

示例仅提供思路：

常用前台 JS 函数

自动加上验证事件及日期按钮 (htc 方式 )

自动加上验证事件及日期按钮 (js 方式 )

Ctrl + 鼠标＝选中 (20050214)

固定 Div(20050214)

可以盖住 select 的 div(20041216)

可输入下拉框 (20041126)( 相似高亮显示，不相似移除 )

可输入下拉框 (20041126)( 相似高亮显示，不相似不移除 )

改变 table 的列宽 (20041103)

可用鼠标移动和改变大小的 table(20041029)

用鼠标移动 TR(20050107)

固定 Table 首行 (20041123)

固定 Table 首行首列 (20041123)

Main Content Div

从服务器端取值并回填到页面

动态明细示例

多功能 multiple-update

一个简单的 IFRAME 框架

调用客户端发邮件程序

读取客户端文件

一级选择左右移动及排库

二级选择左右移动

提交到特定大小的窗口

忠实显示 Text 内容 ( 不同于 Pre 标签 )

自动关闭 Alert 对话框

年月日选择

提交到特定大小的窗口

忠实显示 Text 内容 ( 不同于 Pre 标签 )

自动关闭 Alert 对话框

年月日选择

JS 对 cookie 操作

function setCookie(name,value)

{

var Days = 30; // 此 cookie 将被保存 30 天

var exp = new Date(); //new Date("December 31, 9998");

exp.setTime(exp.getTime() + Days*24*60*60*1000);

document.cookie = name + "="+ escape(value) +";expires="+ exp.toGMTString();

}

function getCookie(name)

{

var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));

if(arr != null) return unescape(arr[2]); return null;

}

function delCookie(name)

{

var exp = new Date();

exp.setTime(exp.getTime() - 1);

var cval=getCookie(name);

if(cval!=null) document.cookie=name +"="+cval+";expires="+exp.toGMTString();

}

var _st = window.setTimeout;

/* 重载 window.setTimeout 函数 , 引用的函数可以带参数 */

window.setTimeout = function(fRef, mDelay) {

if(typeof fRef == 'function'){

var argu = Array.prototype.slice.call(arguments,2);

alert(typeof(argu));

var f = (function(){ fRef.apply(null, argu); });

return _st(f, mDelay);

}

return _st(fRef,mDelay);

}

function test(x){

alert(x);

}

window.setTimeout(test,3000,'fason');

</script>

<!--

/*@cc_on @*/

/*@if (@_win32 && @_jscript_version>=5)

function window.confirm(str)

{

str=str.replace(/\'/g, "'&chr(39)&'").replace(/\r\n|\n|\r/g, "'&VBCrLf&'");

execScript("n = msgbox('"+ str +"', 257, ' 自定的的 confirm')", "vbscript");

return(n==1);

}

@end @*/

alert(confirm('sure?'));

// -->

</script>

// 两端去空格函数

function trim(str) {

return str.replace(/(^\s*)|(\s*$)/g,"");

}

// 为 Number 增加 length 方法

Number.prototype.length = function()

{

return String(this).length;

}

alert((11).length())

</script>

Ms XmlDom 异步装载 Xml 文件

放在这里，算作是资源备份吧。

var xmldoc;

function Load(){

xmldoc = new ActiveXObject("Msxml2.DOMDocument");

xmldoc.onreadystatechange = CheckState;

xmldoc.resolveExternals = false;

xmldoc.load(URL.value);

}

function CheckState(){

var state = xmldoc.readyState;

RESULTS.innerHTML += " 加载状态 = " + state + "<BR>"

if (state == 4){

var err = xmldoc.parseError;

if (err.errorCode != 0)

RESULTS.innerHTML += err.reason + "<BR>"

else

{

RESULTS.innerHTML += " 加载成功。 " + "<BR>"

alert(xmldoc.xml)

}

</script>

URL: <input type=text size=60 id=URL value="http://dotnet.aspx.cc/Rss.aspx">

// 带中文字符串长度 , 一个中文字长度为 2

String.prototype.lenB = function(){return this.replace(/[^\x00-\xff]/g,"**").length;}

document.all.tes1.value.lenB();

预判断一下链接 URL 是否可用

function getURL(url)

{

var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");

xmlhttp.open("GET",url,false);

xmlhttp.send();

if (xmlhttp.readyState==4)

alert((xmlhttp.Status==200)?" 存在 ":" 不存在 ");

}

//user like this:

getURL("http://localhost/1.asp")

</script>

// 将数字转换成三位逗号分隔的样式

function formatNum(s)

{

if(!/^(\+|-)?\d+(\.\d+)?$/.test(num)){alert("wrong!"); return num;}

var re = new RegExp().compile("(\\d)(\\d{3})(,|\\.|$)");

num += ""; while(re.test(num))

num = num.replace(re, "$1,$2$3")

return num;

}

alert(formatNum(-12345678.123));

alert(formatNum("12345678.123"));

alert(formatNum("10000000000000000000000000000000000000000"));

格式化日期 :yyyy-m-d to yyyy-mm-dd

<!--

var str = "2005-3-2"; //2005-03-02

var str = "2005-3-22"; //2005-03-02

str = str.replace(/(\D)(\d)(?=\D|$)/g, "$10$2");

alert(str);

//-->

</SCRIPT>

表格中的行删除功能 , 用 checkbox 选择的

<!--

var curRow=null;

function selectRow(tr1){

if(curRow)

curRow.bgColor="#FFFFFF";

tr1.bgColor="e7e7e7";

curRow=tr1;

}

function delTr(){

var chks=document.getElementsByName("chkDelete");

var tb=document.getElementById("tbContent");

for(var i=chks.length-1;i>=0;i--){

if(chks[i].checked){

tb.deleteRow(i);

}

//-->

</script>

<!--

for(var i=0;i<25;i++)

document.write('<tr height=20 algin="center"

width="20%"><input type="checkbox" name="chkDelete"></td><td width="80%"

align="center">'+i+'</td></tr>');

//-->

</script>

</table>

</div>

yyyy-mm-dd 格式日期完整校验加提示

<!--

function CheckDate(strDate){

var reg=/^(\d{4})([-])(\d{2})([-])(\d{2})/;

if(!reg.test(strDate)){

alert(" 日期格式不正确 !\n 正确格式为 :2004-01-01");

return false;

}

var ss=strDate.split("-");

var year=ss[0];

var month=ss[1];

var date=ss[2];

if(!checkYear(year)){return false;}

if(!checkMonth(month)){return false;}

if(!checkDate(year,month,date)){return false;}

return true;

}

function checkYear(year){

if(isNaN(parseInt(year))){alert(" 年份输入有误 , 请重新输入 !"); return false;}

else if(parseInt(year)<1950 || parseInt(year) >2050){ alert(" 年份应该在 1950-2050 之间

!"); return false}

else return true;

}

function checkMonth(month){

if(isNaN(parseInt(month))){alert(" 月份输入有误 , 请重新输入 !"); return false;}

else if(parseInt(month)<1 || parseInt(month) >12){ alert(" 月份应该在 1-12 之间 !");

return false}

else return true;

}

function checkDate(year,month,date){

var daysOfMonth=CalDays(parseInt(year),parseInt(month));

if(isNaN(parseInt(date))){alert(" 日期输入有误 , 请重新输入 !"); return false;}

else if(parseInt(date)<0||parseInt(date)>daysOfMonth){ alert(" 日期应该在 1

-"+daysOfMonth+" 之间 !"); return false;}

else return true;

}

function CalDays(year,month){

var date= new Date(year,month,0);

return date.getDate();

}

function isLeapYear(year){

if((year %4==0 && year %100!=0) || (year %400==0)) return true;

else return false;

}

alert(CheckDate("2007-02-29"));

//-->

</script>

<!--

/* 函数名称 : dateAfterDays

* 函数功能 : 返回与某日期相距 N 天 (N 个 24 小时 ) 的日期

* 函数参数 : num number 类型可以为正负整数或者浮点数

* 函数返回 : 新的日期

* 调用方法 : dateObject.dateAfterDays(num);

*/

Date.prototype.dateAfterDays=function(num){

if(typeof(num)!="number") throw new Error("Date(num) 参数为数值类型 .",-1);

var date = this.valueOf();

date += num*24*3600*1000;

return new Date(date);

}

var dd= new Date();

alert(dd.dateAfterDays(1.5));

//-->

</script>

类似 CSDN 感兴趣社区配置页面中的 checkbox 选择的功能

<!--

function chkClk(obj){

var chks=document.getElementsByName(obj.name);

if(obj.flag=="main"){

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

chks[i].checked=obj.checked;

}

else{

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

if(chks[i].checked==false){

chks[0].checked=false;

break;

}

else{

if(i==chks.length-1) chks[0].checked=true;

}

//-->

</script>

<input type="checkbox" name="type1" flag="main">typetext

<li><input type="checkbox" name="type1">typetext</li>

<input type="checkbox" name="type2" flag="main">typetext

<li><input type="checkbox" name="type2">typetext</li>

常用链接

留言簿(4)

随笔分类(20)

随笔档案(31)

技术Blog

最新评论

阅读排行榜


只有注册用户登录后才能发表评论。




网站导航: 博客园 IT新闻知识库 C++博客博问管理