[译]JavaScript事件(三)事件
事件
本页我将给出最重要的几个事件的概览,包括现代浏览器的兼容性信息。
本页给出的事件在HTML元素上发生时,大部分的浏览器都会识别。就是说浏览器会查看是否有事件处理程序注册到这个事件上,如果有就立即执行。
刚开始,只有几个事件。这些事件在所有的支持JavaScript的浏览器中都能使用,甚至最老的浏览器。请注意早期的事件只在链接和form上能使用,有时候整个窗体,但是不能用在更多的HTML元素了。
从那时到现在情况已经改变了很多,更多新的事件添加进来,大多数的4代浏览器允许将事件注册到任何HTML元素。
所以你可以检测几乎任何东西上的几乎任何事件,虽然 p 标签的keydown事件没什么意义。
查看事件和他们的浏览器兼容性列表,快速了解事件的完整列表和兼容性。
Interface事件
Interface事件不是由用户动作触发的,但是由用户动作的结果触发的。
用户点击一个元素总会触发click事件。当用户点击到一个有特殊意义的元素上,额外的interface事件就会被触发。
比如,当用户点击一个链接,产生一个点击事件,点击链接一个新的页面会被加载,所以这个点击事件的结果就是interface事件unload产生。其它的interface事件有resize,scroll 和 focus/blur。
鼠标事件
从Netscape 2起,所有的浏览器认识链接上的两个事件。当鼠标移动到链接上,mouseover事件触发,当点击它click事件触发。不久mouseout事件也添加进来了,当鼠标离开链接它会被触发。鼠标事件的Traditional Triad(三重唱什么的)形成了。
从第三代浏览器开始,鼠标事件开始激增。dblclick事件也添加进来,click事件也被分成 mousedown 和 mouseup;用户点下和松开鼠标的时候触发。最终,mousemove 事件也可以被使用了。
你可以在鼠标事件页面看到有关详细信息。
表单事件
表单(form)可以识别submit 和 reset 事件,当用户提交或者重置一个form——之前——被触发。submit事件是任何验证脚本的关键所在。当用户提交一个form,遍历所有的form中所有的字段,检查用户是否填写了正确的数据。如果发现了错误,终止提交并给用户一个警告。
表单(form)还可以识别focus 和 blur 事件,当获得或者失去焦点时触发。还有键盘事件(Key events) 和点击事件(click event)。请参阅其他地方查看兼容性信息。
一般来说,你应该小心使用这些事件。表单失去焦点(onblur)就开始验证很方便,但是很多验证都用alert提示,很烦人。当用户忙着填写表单的时候不想看到一个又一个的弹出窗口。
W3C 事件
在W3C的 DOM 2 事件规范中定义了Mutation事件。当DOM结构发生改变时触发。最常见的是DOMSubtreeModified事件,当HTML元素中的DOM树任何时候发生任何改变的时候触发。
Mozilla 把他改成了subtreemodified。 因为即使Mozilla也不支持(DOMSubtreeModified),所以本文不会介绍任何其他W3C事件了。
Microsoft 事件
微软创建了大量的专用事件。其中有一些很有意思。
- contextmenu事件,当用户请求context menu(右键菜单)时触发。它被大量使用——也被大量滥用。 Mozilla也支持这个事件。
- 加载xml文件时readystatechange事件被当作一种加载事件。当xml文件的readyState变成4,文档就加载完成了(不要问我什么是readyState,只要知道他是这样用的就行了)。
- 文档unload之前,beforeunload会被触发。他的目的是可以取消unloading页面,但强烈建议不要使用。
- 最后,微软发明了mouseenter和mouseleave,跟mouseover和mouseout很像但不完全相同。鼠标事件页面会有讨论。
当然这些事件只有IE支持。
Mozilla 事件
Mozilla同样也有大量的专用事件,我还没有详细的研究过。
事件处理
所有这些事件发生时都会被浏览器检测到。浏览器自动执行默认行为,比如打当连接被点击,打开链接。没有事件时什么也不会发生。
事件处理的重点是你可以让一些事情发生。你可以定义自己的脚本处理事件,事件发生时你的脚本执行,如果发生的事情很有用并且很合理,你的用户会乐意看到这些额外的交互。
为了确保事件发生时你的脚本会执行,你得把事件注册到特定HTML元素的特定事件上,比如。
<a href="somewhere.html" onClick="alert('I\'ve been clicked!')">
现在当点击事件发生在这个链接上时,脚本alert('I\'ve been clicked!')会执行。这就是注册事件处理程序。
继续
如果你想顺序读完所有的文章,你可以继续下一篇早期的事件处理程序。
全文目录:http://www.cnblogs.com/Kamal/articles/javascript_events_contents.html