js 事件机制

事件处理

事件是指某一特定情况，在网页中，发生用户点击鼠标，用户按下按键等事件时往往要执行相应处理。js的事件机制用来解决这些问题。
DOM1定义的事件机制简单实用，且所有浏览器都支持，所以在一般情况下使用DOM1的事件机仍然是一个好的选择。

DOM1定义的事件机制中，通过在对象的事件属性上直接赋值回调函数来处理事件。当事件发生时回调函数会被调用，且this变量指向回调所属的对象。

若回调函数返回false将阻止该事件的默认处理方式（例如a标签点击事件默认将发生跳转）。

由于回调函数是赋值到对象属性的，所以在DOM1中一个对象的一个事件只能对应一个回调函数。（但可以通过一些技巧来使其支持多个回调函数）
事件属性名为on+事件名，全小写例如onclick。
要处理一个对象的鼠标点击事件则可以写成
node.onclick = function(evt){
    alert("you click " + this.id);
    return false;
};
//这段代码指示在用户点击node对象时弹出信息窗口显示node的id，并阻止node对象的默认点击事件处理。

窗口事件

onload    当用户进入页面且所有页面元素都完成加载时
onunload    当页面已经关闭时
onbeforeunload    但页面这要关闭时（例如用户点击了关闭按钮但页面还没有被关闭的时候）
onresize    当窗口大小调整时
onmove    当窗口移动时
onfocus    当窗口获得焦点时
onblur    当窗口失去焦点时
onscroll    当用户向上或向下滚动页面时
onDOMContentLoaded    当html文件加载完成时（onload是在html文件和图片等资源文件都加载完成的情况下才触发）

鼠标事件

onmousedown    鼠标按下
onmouseup    鼠标放开
onmousemove    鼠标移动
onmouseover    鼠标进入
onmouseout    鼠标离开
onclick        鼠标单击

表单事件        

onsubmit    当表单提交（事件对象是表单不是提交按钮）
onreset        当表单重置（事件对象是表单不是重置按钮）
onchange    当控件更改
onselect    当控件选中
onclick        当空间点击
onfocus        当控件获得焦点

onblur        当控件失去焦点

按键事件

onkeydown    按键按下
onkeyup        按键松开

Event 对象

鼠标事件属性

altKey     返回当事件被触发时，"ALT" 是否被按下。
button     返回当事件被触发时，哪个鼠标按钮被点击。
clientX     返回当事件被触发时，鼠标指针的水平坐标。
clientY     返回当事件被触发时，鼠标指针的垂直坐标。
ctrlKey     返回当事件被触发时，"CTRL" 键是否被按下。
metaKey     返回当事件被触发时，"meta" 键是否被按下。
relatedTarget     返回与事件的目标节点相关的节点。
screenX     返回当某个事件被触发时，鼠标指针的水平坐标。
screenY     返回当某个事件被触发时，鼠标指针的垂直坐标。

shiftKey     返回当事件被触发时，"SHIFT" 键是否被按下。

键盘事件属性

event.which    DOM浏览器中使用，表示键的ASC码
event.keyCode    IE浏览器中使用，表示键的ASC码

高级事件处理

（IE8及以下不支持）

node.addEventListener(type, callback);    //添加一个事件监听，高级事件机制支持为一个对象的一个事件添加多个监听回调

node.removeEventListener(type, callback);    //移除一个事件监听
node.dispatchEvent(event);    //派发一个事件

document.createEvent("Event") //创建一个事件对象
event.initEvent(type) //初始化事件
event.stopPropagation() //让事件停止冒泡
event.preventDefault() //阻止事件的默认处理