事件对象的属性和使用

利用上一篇文章说明的方法，我们对事件添加了处理程序，然后可以来具体处理事件了。首先大部分浏览器会将 event 对象作为参数传递给事件处理程序，从而我们可从 event 对象中读取事件的具体内容。但是在 IE9 之前用 DOM0 级方法添加的事件处理程序，event 事件是作为 window 对象的属性传递过去的。因此，我们需要用下面的方法保证跨浏览器的兼容性：

var handler = function(event) {

    var ev = event ? event : window.event;

    alert(ev.type);

};

如果要得到触发该事件的元素，在标准浏览器中可以用 event.target，而在 IE9 之前的浏览器中可以用 event.srcElement。例如：

var handler = function(event) {

    var ev = event ? event : window.event;

    var target = ev.target || ev.srcElement;

    // do something

};

如果我们在子元素的事件处理程序中要阻止事件继续冒泡到父元素，可以用 stopPropagation() 方法。但是 IE9 之前不支持此方法，需要改用 cancelBubble 属性。例如：

var handler = function(event) {

    var ev = event ? event : window.event;

    ev.stopPropagation ? ev.stopPropagation() : ev.cancelBubble = true;

};

类似地，如果要阻止默认行为的发生，例如点击链接后阻止打开它，可以分别用 preventDefault() 方法和 returnValue 属性。例如：

var handler = function(event) {

    var ev = event ? event : window.event;

    ev.preventDefault ? ev.preventDefault() : ev.returnValue = false;

};

最后，各个主流浏览器都支持在事件处理程序中使用 return false 语句，它等同于既阻止事件冒泡又阻止默认行为，然后返回。

参考资料：
[1] event.stopPropagation - MDN
[2] event.preventDefault - MDN
[3] cancelBubble property - MSDN
[4] stopPropagation method - MSDN
[5] returnValue property - MSDN
[6] preventDefault method - MSDN
[7] Javascript - Event order
[8] event.target - MDN
[9] target property - MSDN
[A] srcElement property - MSDN
[B] The difference between ‘return false;’ and ‘e.preventDefault();’
[C] 黑客志 | jQuery事件处理: 别再乱用“return false”了