Javascript：事件

信息：原创2014-09-160 次阅读0 个评论

标签：后天堂向上，网站制作，自学教程，网站技术，javascript，javascript 事件


Javascript 事件类型：HTML事件、键盘事件、鼠标事件。


HTML 事件

事件名称 触发条件
onload 文档或者图片加载完毕之后
onunload 文档被卸载
onabort 图片加载被中断
onfocus 对象获取焦点
onblur 对象失去焦点
onchange 表单元素值被改变
onerror 脚本发生错误
ondragdrop 用户将一个对象拖放到浏览器窗口中
onmove 浏览器窗口移动
onreset 表单重置按钮被点击
onsubmit 表单提交按钮被点击
onselect 表单控件文字被选定
oncontextmenu 上下文菜单事件（鼠标右键弹出窗）




键盘事件

事件名称 触发条件
onkeydown 键盘按键被按下
onkeypress 键盘按键被按下然后松开（仅对字符键有效）
onkeyup 键盘按键被松开

keyCode、charCode

在发生 keydown、keyup 中，event 对象的 keyCode 属性会包含一个代码，其值与 ASCII 码 相对应。

火狐、谷歌、苹果的 event 对象都支持 charCode 属性，这个属性只有在发生 keypress 事件时才包含值。

事件属性 火狐 谷歌 苹果 IE10 IE9 IE8-
字 非 字 非 字 非 字 非 字 非 字 非
keydown keyCode √ √ √ √ √ √ √ √ √ √ √ √
charCode × × × × × × × × × × - -
keypress keyCode × √ √ × √ × √ × √ × √ ×
charCode √ × √ × √ × √ × √ × - -

（以上数据均经过测试，字：字符按键，非：非字符按键，√：支持，×：不支持，-：无此属性）





鼠标事件

事件名称 触发条件
onclick 标签对象被单击
ondblclick 标签对象被双击
onmousedown 鼠标在对象上按下
onmouseup 鼠标在对象上按下后松开
onmouseover 鼠标移到对象上
onmouseout 鼠标移出对象外
onmousemove 鼠标在对象上移动

鼠标事件对象可以用于检测用户鼠标的操作情况和鼠标指针的定位。

鼠标事件主要是通过 onmousedown、onmouseup 来触发的，大部分高版本的浏览器都支持了 W3C 鼠标事件对象，但 IE8 及其以下的浏览器并不支持，鼠标事件对象使用的是自己的标准。


W3C 鼠标事件对象 button 属性

属性值 说明
0 鼠标左键被按下
1 鼠标中间被按下
2 鼠标右键被按下

IE 鼠标事件对象 button 属性

属性值 说明
0 鼠标无操作
1 鼠标左键被按下
2 鼠标右键被按下
3 鼠标左、右键同时被按下
4 鼠标中键被按下
5 鼠标左键、中键同时被按下
6 鼠标右键、中键同时被按下
7 鼠标左键、中键、右键同时被按下

鼠标位置

属性 属性值 说明
clientX 数值 可视区域 X 坐标，距离左边框的距离
clientY 数值 可视区域 Y 坐标，距离上边框的距离
screenX 数值 屏幕区域 X 坐标，距离屏幕左边的距离
screenY 数值 屏幕区域 Y 坐标，距离屏幕上边的距离

修改键

属性 属性值 说明
shiftKey 布尔值 鼠标点击时，是否按下了 Shift 键
ctrlKey 布尔值 鼠标点击时，是否按下了 Ctrl 键
altKey 布尔值 鼠标点击时，是否按下了 Alt 键
metaKey 布尔值 鼠标点击时，是否按下了 windows 键




W3C 与 IE

W3C 事件对象

属性/方法 类型 读写 说明
bubbles Boolean 只读 事件是否冒泡
cancelable Boolean 只读 是否可以取消事件的默认行为
currentTarget Element 只读 其事件处理程序当前正在处理事件的那个元素
detail Integer 只读 事件细节
eventPhase Integer 只读 事件阶段 1.捕获阶段 2.处理目标 3.冒泡阶段
target Element 只读 事件的目标
view AbstractView 只读 与事件相关联的抽象视图
preventDefault() Function 只读 取消事件的默认行为
stopPropagation() Function 只读 取消事件的进一步捕获或冒泡

IE 事件对象

属性/方法 类型 读写 说明
cancelBubble Boolean 读写 取消事件的冒泡，默认值为 false
returnValue Boolean 读写 取消事件的默认行为，默认值为 true
srcElement Element 只读 事件的目标
type String 只读 事件的类型