开发学院网页设计 JavaScript JavaScript Event学习第四章：传统的事件注册模型... 阅读

JavaScript Event学习第四章：传统的事件注册模型

　2010-03-30 00:00:00　来源：WEB开发网　　　

核心提示： 1element.onclick=doSomething(); 那么这个函数就会执行并且它的结果会被注册到onclick上，这可不是我们所期望的，JavaScript Event学习第四章：传统的事件注册模型(3)，我们只是希望在事件发生的时候函数能够执行，另外函数写出来是为了

1　element.onclick　=　doSomething(); 

那么这个函数就会执行并且它的结果会被注册到onclick上。这可不是我们所期望的，我们只是希望在事件发生的时候函数能够执行。另外函数写出来是为了在事件发生的时候执行，如果没有关联的执行会造成严重的混乱和错误。

所以我们在事件处理程序中复制整个doSomething()方法。我们只是想在事件执行的时候执行这个函数。

this

在JavaScript里this关键字通常指函数的所有者。如果this指向事件发生的HTML元素，那么一切都是那么的美好，你可以很简单的做很多事情。

不幸的是，虽然this非常的强大，但是如果你不是明确的知道他怎么运作的话使用起来还是比较难的。关于这个我在另一个地方有详细的讨论，在这我在传统模式下做一些概述。

在传统模式里this工作如下；注意这个跟内联模式稍微有些不同。现在this关键字在函数里，而不是在HTML的参数上。这个区别后面会另外讲的。

1　element.onclick　=　doSomething; another_element.onclick　=　doSomething; function　doSomething()　{ 　　　　this.style.backgroundColor　=　'#cc0000'; } 

如果你注册了doSomething()作为任何一个HTML元素的click事件，那么当用户点击那个元素的时候元素就得到一个背景。

匿名函数(Anonymous functions)

假设你想所有div在鼠标经过的时候改变背景色，然后在鼠标离开的时候返回背景色。正确的使用this，你可以这样写：

1　var　x　=　document.getElementsByTagName('DIV'); for　(var　i=0;i<x.length;i++)　{ 　　　　x[i].onmouseover　=　over; 　　　　x[i].onmouseout　=　out; } function　over()　{ 　　　　this.style.backgroundColor='#cc0000' } function　out()　{ 　　　　this.style.backgroundColor='#ffffff' } 

编缉推荐阅读以下文章