《JavaScript高级程序设计》读书笔记13.4事件类型

• 大致分为8类
  1. UI事件，当用户与页面上的元素交互时触发；
  2. 焦点事件，当元素获得或失去焦点时触发；
  3. 鼠标事件，当用户通过鼠标在页面上执行操作时触发；
  4. 滚轮事件，当使用鼠标滚轮（或类似设备）时触发；
  5. 文本事件，当在文档中输入文本时触发；
  6. 键盘事件，当用户通过键盘在页面上执行操作时触发；
  7. 合成事件，当为（IME输入法编辑器）输入字符时触发；
  8. 变动事件，当底层DOM结构发生变化时触发；

UI事件

UI事件指的是那些不一定与用户操作有关的事件。
多数与window对象或表单控件相关。

• 有7种：
  1. load，当页面完全加载后在window上面触发，当所有框架都加载完毕时在框架集上面触发，当图像加载完毕时在元素上触发，或者嵌入的内容加载完毕时在<object>元素上触发。
  2. unload，当页面完全卸载后在window上面触发，当所有框架都卸载完毕时在框架集上面触发，或者嵌入的内容卸载完毕时在<object>元素上触发。
  3. abort，在用户停止下载过程中，如果嵌入的内容没有加载完，则在<object>元素上触发。
  4. error，当发生JavaScript错误时在window上触发，当无法加载图像时在<img>元素上触发，当无法加载嵌入内容时在<object>元素上触发，或者当有一或多个框架无法加载时在框架集上触发
  5. select，当用户选择文本框（input或texterea）中的一或多个字符时触发
  6. resize，当窗口或框架的大小变化时在window或框架上触发。
  7. scroll，当用户滚动带滚动条的元素中的内容时，在该元素上触发。

焦点事件

焦点事件会在页面元素获得或失去焦点时触发。

• 主要有2个：
  1. blur，失去焦点时触发，不会冒泡，全浏览器支持。
  2. focus，获得焦点时触发，不会冒泡，全浏览器支持。

鼠标与滚轮事件

• 有9个鼠标事件
  1. click，主鼠标键或回车键。
  2. dblclick，双击主鼠标键。
  3. mousedown，按下了任意鼠标键触发，不能键盘触发。
  4. mouseenter，鼠标光标从元素外部首次移动到元素范围之内时触发,不冒泡，而且在后代元素上不触发。
  5. mouseleave，位于元素上方的鼠标光标移动到元素范围之外时触发，不冒泡，而且在后代元素上不触发。
  6. mousemove,鼠标指针在元素内部移动时重复触发。
  7. mouseout，鼠标指针位于一个元素上方，然后用户将其移入另一个元素（移开）时触发。
  8. mouseover，鼠标指针位于一个元素外部，然后用户将其首次移入另一个元素边界之内时触发。
  9. mouseup,释放鼠标按键时触发，不能键盘触发。

客户区坐标位置

事件发生时鼠标指针在视口中的水平坐标clientX和垂直左边clientY，保存在事件对象中。

代码示例
var div=document.getElementById("myDiv");
EventUtil.addHandler(div,"click",function(event){
    event=EventUtil.getEvent(event);
    alert("Client coordinates:"+event.clientX+","+event.clientY);
})

页面坐标位置

事件对象的pageX和pageY属性，能告诉事件在页面中的什么位置发生。

屏幕坐标位置

事件对象的screenX和screenY属性，能告诉事件在页面中的什么位置发生。

键盘与文本事件

• keydown
• keypress
• keyup
• textInput

复合事件

变动事件

HTML5事件

设备事件

触摸与手势事件