黑马程序员技术交流社区

标题: 关于事件机制在JavaScript和DOM编程中的思考 [打印本页]

作者: 王海舟 时间: 2012-9-3 10:07
标题: 关于事件机制在JavaScript和DOM编程中的思考
前段时间，我发了两个帖子：
JavaScript中事件关联方法弄不明白的地方？

一个纠结了很久，弄不明白的问题？
都是关于事件机制在javascript和dom编程中无法理解的问题。现在自己终于有些心得了，特发出来分享下子：{:soso_e120:}

将问题重复贴一次：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript">
function f1() {
alert("我是f1");
}
function f2() {
alert("我是f2");
}
</script>
</head>
<body>
<input type="button" value="请点我1" onclick="f1()" />
<input type="button" value="请点我2" onclick="document.ondblclick=f2" />
</body>
</html>

复制代码

问题如下：
<input type="button" value="请点我1" />
<input type="button" value="请点我2" />
这两行代码中：
前一行的方法f1后面加了括号，为onclick="f1()" ；
后一行的方法f2后面没有加括号，为onclick="document.ondblclick=f2"

我的理解是：将方法和这个事件onclick相关联，其实就是将方法的地址的引用传给这个事件中包含的委托链。
我弄不明白的是为什么前一行代码方法f1后面要加上括号呢？这样岂不是调用方法f1，然后将f1的返回值赋值给onclick事件？onclick事件应该接收的是地址（即指针）呀，怎么变成接收一个方法的返回值了呢？

————————————————————————————————我是华丽的分割线——————————————————————————————————

上面的部分就是一直纠结着我的问题，现在来分享下我的心得：
——第一部分：
onclick="document.ondblclick=f2"这一行代码，毫无疑问就是将document.ondblclick=f2这个事件赋值给onclick事件，其内部是先将f2这个方法与document.ondblclick这个事件相关联。
其实质就是：先将f2这个方法的方法地址这个引用类型的数据赋值给document.ondblclick事件（因为事件其内部包含一个委托链，所以事件是可以接收地址类型的数据的），然后再将document.ondblclick这个事件赋值给onclick事件。
造成的结果就是如果先触发了onclick事件，然后再触发document.ondblclick事件的话，就会自动调用与document.ondblclick事件相关联的f2方法。
——第二部分：
onclick="f1()" 这一行代码，它表示的不是将f1这个方法和onclick事件相关联，而是通过onclick事件中的委托链中所包含的方法调用f1这个方法。也就是说f1方法不属于onclick事件，只是通过onclick事件调用f1方法而已。
至于返回值的问题，由于JavaScript是一门弱类型的语言，所以它可以没有返回值。

作者: 许庭洲 时间: 2012-9-3 10:15
太有才了！

作者: 王海舟 时间: 2012-9-3 10:19

许庭洲发表于 2012-9-3 10:15
太有才了！

:handshake,向您学习，奋斗Ing~~~

欢迎光临黑马程序员技术交流社区 (http://bbs.itheima.com/)

黑马程序员IT技术论坛 X3.2