很多动态性的程序都定义了事件句柄,当某个事件发生时,Web浏览器会自动调用相应的事件句柄。由于客户端JavaScript的事件是由HTML对象引发的,因此事件句柄被定义为这些对象的属性。例如,要定义在用户点击表单中的复选框时调用事件句柄,只需把处理代码作为复选框的HTML标记的属性:
<input type="checkbox" name="options" value="giftwrap" οnclick="giftwrap=this.checked;">
在这段代码中,我们感兴趣的是属性onclick。onclick的属性值是一个字符串,其中包含一个或多个JavaScript语句。如果其中有多条语句,必须使用分号将每条语句隔开。当指定的事件发生时,字符串的JavaScript代码就会被执行。
虽然可以在事件句柄定义中加入任意多条JavaScript语句,然而,经常使用的一种技术就是,使用事件句柄属性来调用在<script>标记中所定义的函数。这样一来,大部分JavaScript代码都存放在脚本中,从而减少了JavaScript和HTML的混合。
注意,HTML的事件句柄属性并不是定义JavaScript事件句柄的唯一方式。我们也可以在一个<script>标记中使用JavaScript代码来为HTML元素指定JavaScript事件句柄。一些JavaScript开发者争论说不应该使用HTML的事件句柄属性,真正无干扰的JavaScript要求内容和行为的完全分离。根据这一JavaScript编程风格,所有的JavaScript代码都应该放到一个外部文件中,通过HTML的<script>标记的src属性来引用该文件。不管在运行的时候需要哪种事件句柄,都可以定义这样的一个外部JavaScript代码。
下面介绍几个最常用的事件句柄属性:
onclick:所有类似按钮的表单元素和标记<a>及<area>都支持该句柄属性。当用户点击元素时会触发它。如果onclick处理程序返回false,则浏览器不执行任何与按钮和链接相关的默认动作,例如,它不会进行超链接或提交表单。
onmousedown,onmouseup:这两个事件句柄和onclick非常相似,只不过分别在用户按下和释放鼠标按钮时触发。大多数文档元素都支持这两个事件句柄属性。
onmouseover,onmouseout:分别在鼠标指针移到或移出文档元素时触发。
onchange:<input> <select>和<textarea>元素支持这个事件句柄。在用户改变了元素显示的值,或移出了元素的焦点时触发。
onload:这个事件句柄出现在<body>标记上,当文档及其外部内容完全载入时触发。onload句柄常常用来触发操作文档内容的代码,因为它表示文档已经达到了一个稳定的状态并且修改它是安全的。