您现在正在浏览：站长之家 >> 设计编程 >> 详细内容

完美解决一个事件激活多个函数

时间:2007-12-27 来源:不详作者:林子

假如你的网页中一个“OnLoad”事件要激活两个以上的javascript函数，那怎么办呢？小阳曾查阅了不少资料，结果都不尽如人意，无非是程序员根据情况，把要激活的函数统一放在一个函数里激活。

　　但作为一个程序员，编写的代码的适用性是很重要的。请看下面一个例子：

本文来自织梦

<BODY OnLoad='alert("这是<BODY>标签调用的函数")'>
<script language="javascript">
function myfunction(){
alert("这是JS脚本调用的函数");
}
document.body.onload=myfunction;
</script>
</BODY> 　　本文来自织梦

　　运行后你会发现，它只跳出一个“这是JS脚本调用的函数”的警告框。< BODY>标签中要求激活的函数被“忽略”了。当然你可以运用前面提过的方法，把两个函数放一个函数里激活。但这样有不少弊端，非凡是假如把这段javascript代码写成一个"myjs.js"文件，要用它的话直接加上< script language="javascript" src="myjs.js">< /script>即可，但假如还要在引用文件的页面中根据情况修改标签或者添加一段代码，多麻烦呀。这就降低了代码的适用性了。

本文来自织梦

　　可不可以在编写javascript代码时就设计好，假如前面OnLoad事件已经有函数要激活，让它仍然激活前面的函数，但同时也激活本段代码所需要的函数？答案是肯定的。我们先看下这段代码：织梦好，好织梦

<BODY OnLoad='alert("这是<BODY>标签调用的函数")'>
<script language="javascript">
// document.body.onload是函数（function）型，用toString()函数转为字符串（string）型：
alert(document.body.onload.toString());
</script>
</BODY>　　内容来自dedecms

　　运行后其中一个警告框中提示：

织梦好，好织梦

　　function anonymous()
　　{
　　alert("这是标签调用的函数")
　　} 织梦好，好织梦

　　发现什么了吗？“document.body.onload.toString()”就是上面这段函数代码！我们这段字符串作为代码的一部分运行，那么我们就多了一个函数“anonymous()”，于是将这个函数和我们现在需要激活的函数一起激活就行了！本文来自织梦

下面我们以第一次提到的代码为例进行修改，得到最终代码： dedecms.com

<BODY OnLoad='alert("这是<BODY>标签调用的函数")'>
<script language="javascript">
function myfunction(){
alert("这是JS脚本调用的函数");
}
file://现在我们要激活的函数是“myfunction()”，原来要激活的函数是<BODY>标签里的“alert()”，
file://下面这段代码可以两个一起激活：
myActive="myfunction()";

织梦好，好织梦

if(document.body.onload.toString())
{
eval(document.body.onload.toString().replace('anonymous()','bodyload()'));
document.body.onload=new Function("bodyload();" myActive);
}
else document.body.onload=new Function(myActive);
</script>
</BODY>

织梦内容管理系统

　　上段代码中，变量myActive是JS代码中要激活的函数，eval(string)函数是把其字符串参数当作是javascript脚本来运行。我们把document.body.onload.toString()中的“anonymous()”替换为“bodyload()”，得到一个新函数“bodyload()”，它包含了所有原来要激活的函数，再把函数“bodyload()”和我们要激活的函数一起在OnLoad事件中激活。

内容来自dedecms

　　为什么要把“anonymous()”替换为“bodyload()”呢？因为这个方法适用于所有事件（例如onMouseOver），而所有事件toString()都是得到“anonymous()”，为了不和其它事件也用了这个方法冲突，我们把它替换掉。在其它事件中也依此替换即可。