JScript/JavaScript的参考文档甚少,也不是很详细,很多语法也是一知半解,今天在写事件函数时碰到了一个问题,现讨论如下。
众所周知,在处理HTML元素的事件时可以有多种方法写代码:
1、直接写在HTML元素的on???属性中,如:
<
INPUT
TYPE
="BUTTON"
ONCLICK
="alert('Clicked!')"
VALUE
="Click Me!"
>
或
<
INPUT
TYPE
="BUTTON"
ONCLICK
="alerter()"
VALUE
="Click Me!"
>
这里alerter()是一个写好的JScript函数。
2、使用HTML元素对象的事件属性,如:
<
INPUT
ID
="button1"
TYPE
="BUTTON"
VALUE
="Click Me!"
>
![](https://i-blog.csdnimg.cn/blog_migrate/6a03bf9c0763f8a783ac6347eb7425e6.gif)
<
SCRIPT
LANGUAGE
="JavaScript"
>
button1.onclick = alerter
function alerter()
![](https://i-blog.csdnimg.cn/blog_migrate/6c944c45e24b7e75cf152d8a5c1faf70.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/63df4d8baa5a0a0c3e39c1acaf6d8132.gif)
{
window.alert("You clicked the button!")
}
</
SCRIPT
>
3、使用<SCRIPT FOR>,如:
<
INPUT
ID
="button1"
TYPE
="BUTTON"
VALUE
="Click Me!"
>
![](https://i-blog.csdnimg.cn/blog_migrate/6a03bf9c0763f8a783ac6347eb7425e6.gif)
<
SCRIPT
FOR
="button1"
EVENT
="onclick"
LANGUAGE
="JavaScript"
>
alert("You clicked the button!")
</
SCRIPT
>
4、使用attachEvent函数,如:
<
INPUT
ID
="button1"
TYPE
="BUTTON"
VALUE
="Click Me!"
>
![](https://i-blog.csdnimg.cn/blog_migrate/6a03bf9c0763f8a783ac6347eb7425e6.gif)
<
SCRIPT
LANGUAGE
="JavaScript"
>
button1.attachEvent("onclick", alerter)
function alerter()
![](https://i-blog.csdnimg.cn/blog_migrate/6c944c45e24b7e75cf152d8a5c1faf70.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/63df4d8baa5a0a0c3e39c1acaf6d8132.gif)
{
window.alert("You clicked the button!")
}
</
SCRIPT
>
常用的是第1、2种方法,但有些时候使用第2种方法还是比较合适,比如写body.onload时,不一定方便把onLoad属性写在<body>元素内。特别是ASP.Net中编写Web用户控件(.ascx)时,它并没有<body>元素。于是我写了下面的脚本:
window
.onload
=
alert(
"
Load!
"
);
很高兴地发现它也能够运行,也没有出错。但是很奇怪,它的下一条语句总是不会执行,比如接着还有一条alert("Hi");打开网页后只会看到一个提示“Load!”的对话框,不会出现“Hi”。而且照理应该先出现“Hi”,再出现“Load”的。
原来按照方法2的写法,事件函数是不能带参数的!只能写成window.οnlοad=funcname;的形式,而如果想带参数地调用一个或多个函数,可以把这些语句写到一个函数内。也可以写成:
window.onload
=
function
()
{alert("Load!");}
;
这样相当于产生一个匿名函数。而按原来的写法在window.onload语句时已经错了,自然不会再执行下面的语句了。
看来想问题还是要谨慎,不能想当然。
众所周知,在处理HTML元素的事件时可以有多种方法写代码:
1、直接写在HTML元素的on???属性中,如:
![](https://i-blog.csdnimg.cn/blog_migrate/375f25295552cc2ef18034ef81f38f2d.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/375f25295552cc2ef18034ef81f38f2d.gif)
2、使用HTML元素对象的事件属性,如:
![](https://i-blog.csdnimg.cn/blog_migrate/375f25295552cc2ef18034ef81f38f2d.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a03bf9c0763f8a783ac6347eb7425e6.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/797511e94230455c83f08dbf389a5b10.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/b854634c0904529d4018c4c3336be836.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/09371f44286024fe1913cee8967ae4e2.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/09371f44286024fe1913cee8967ae4e2.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6c944c45e24b7e75cf152d8a5c1faf70.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/63df4d8baa5a0a0c3e39c1acaf6d8132.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/b854634c0904529d4018c4c3336be836.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/09371f44286024fe1913cee8967ae4e2.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/797eaa7b4733b9c83c81b244ee2b8931.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/375f25295552cc2ef18034ef81f38f2d.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/375f25295552cc2ef18034ef81f38f2d.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a03bf9c0763f8a783ac6347eb7425e6.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/797511e94230455c83f08dbf389a5b10.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/b854634c0904529d4018c4c3336be836.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/797eaa7b4733b9c83c81b244ee2b8931.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/375f25295552cc2ef18034ef81f38f2d.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/375f25295552cc2ef18034ef81f38f2d.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/375f25295552cc2ef18034ef81f38f2d.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a03bf9c0763f8a783ac6347eb7425e6.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/797511e94230455c83f08dbf389a5b10.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/b854634c0904529d4018c4c3336be836.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/09371f44286024fe1913cee8967ae4e2.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/09371f44286024fe1913cee8967ae4e2.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6c944c45e24b7e75cf152d8a5c1faf70.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/63df4d8baa5a0a0c3e39c1acaf6d8132.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/b854634c0904529d4018c4c3336be836.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/09371f44286024fe1913cee8967ae4e2.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/797eaa7b4733b9c83c81b244ee2b8931.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/375f25295552cc2ef18034ef81f38f2d.gif)
常用的是第1、2种方法,但有些时候使用第2种方法还是比较合适,比如写body.onload时,不一定方便把onLoad属性写在<body>元素内。特别是ASP.Net中编写Web用户控件(.ascx)时,它并没有<body>元素。于是我写了下面的脚本:
![](https://i-blog.csdnimg.cn/blog_migrate/375f25295552cc2ef18034ef81f38f2d.gif)
原来按照方法2的写法,事件函数是不能带参数的!只能写成window.οnlοad=funcname;的形式,而如果想带参数地调用一个或多个函数,可以把这些语句写到一个函数内。也可以写成:
![](https://i-blog.csdnimg.cn/blog_migrate/6a03bf9c0763f8a783ac6347eb7425e6.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/797511e94230455c83f08dbf389a5b10.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/b854634c0904529d4018c4c3336be836.gif)
看来想问题还是要谨慎,不能想当然。