內容提綱：
1.事件對象
2.冒泡和默認行為
發文不易，轉載請注明出處！
JavaScript 在事件處理函數中默認傳遞了 event 對象，也就是事件對象。但由于瀏覽器的兼容性，開發者總是會做兼容方面的處理。jQuery 在封裝的時候，解決了這些問題，并且還創建了一些非常好用的屬性和方法。
一．事件對象
事件對象就是 event 對象，通過處理函數默認傳遞接受。之前處理函數的 e 就是 event事件對象，event 對象有很多可用的屬性和方法，詳見JavaScript 基礎篇。
對其中的幾個進行說明：
//通過 event.type 屬性獲取觸發事件名
$('input').click(function (e) {
alert(e.type);
});
//通過 event.data 獲取額外數據，可以是數字、字符串、數組、對象
$('input').bind('click', 123, function () { //傳遞 data 數據
alert(e.data); //獲取數字數據123
});
注意：如果字符串就傳遞：'123'、如果是數組就傳遞：[123,'abc']，如果是對象就傳遞：{user : 'Lee', age : 100}。數組的調用方式是：e.data[1]，對象的調用方式是：e.data.user。
//event.data 獲取額外數據，對于封裝的簡寫事件也可以使用
$('input').click({user : 'Lee', age : 100},function (e) {
alert(e.data.user);
});
PS：鍵值對的鍵可以加上引號，也可以不加；在調用的時候也可以使用數組的方式：alert(e.data['user']);
區別：target，currentTarget，relatedTarget：
//通過 event.target 獲取觸發事件的 DOM 元素
$('input').click(function (e) {
alert(e.target);
});
//relatedTarget獲取臨近元素
//獲取移入到 div 之前的那個 DOM 元素
$('div').mouseover(function (e) {
alert(e.relatedTarget);
});
//獲取移出 div 之后到達最近的那個 DOM 元素
$('div').mouseout(function (e) {
alert(e.relatedTarget);
});
//獲取綁定的那個 DOM 元素，相當于 this，區別與 event.target
$('div').click(function (e) {
alert(e.currentTarget);
});
PS：event.target 得到的是觸發元素（比如點擊事件，即具體點擊的那個元素）的 DOM，event.currentTarget 得到的是監聽元素（即綁定的那個元素）的DOM。相當于this， this 也是得到監聽元素的 DOM。
//result獲取上一次相同事件的返回值
$('div').click(function (e) {
return '123';
});
$('div').click(function (e) {
alert(e.result);
});
//which獲取鼠標的左中右鍵
$('div').mousedown(function (e) {
alert(e.which);
});
//which獲取鍵盤的按鍵
$('input').keyup(function (e) {
alert(e.which);
});
//獲取觸發元素鼠標當前的位置
$(document).click(function (e) {
alert(e.screenY+ ',' + e.pageY + ',' + e.clientY);
});
PS：pageX和pageY獲取的是距離頁面原點的位置；screenX和screenY獲取的是距離顯示屏的位置；clientX和clientY獲取的是距離頁面視口的距離。在沒有滾動條的時候，pageY和clientY在數值上是一樣的。當有滾動條的時候，pageY會明顯變大，因為它是相對于頁面原點。
二．冒泡和默認行為
阻止冒泡：
如果在頁面中重疊了多個元素， 并且重疊的這些元素都綁定了同一個事件， 那么就會出現冒泡問題。
示例：
//HTML 頁面
1 <div style="width:200px;height:200px;background:red;">2 <input type="button" value="按鈕" />3 </div>
1 //三個不同元素觸發事件 2 3 $('input').click(function () { 4 5 alert('按鈕被觸發了！'); 6 7 }); 8 9 $('div').click(function () {10 11 alert('div 層被觸發了！');12 13 });14 15 $(document).click(function () {16 17 alert('文檔頁面被觸發了！');18 19 });
PS：當我們點擊文檔的時候，只觸發文檔事件；當我們點擊 div 層時，觸發了 div 和文檔兩個；當我們點擊按鈕時，觸發了按鈕、div 和文檔。觸發的順序是從小范圍到大范圍。這就是所謂的冒泡現象，一層一層往上。
jQuery 提供了一個事件對象的方法：event.stopPropagation()；這個方法設置到需要觸發的事件上時，所有上層的冒泡行為都將被取消。
$('input').click(function (e) {
alert('按鈕被觸發了！');
e.stopPropagation();
});
阻止默認行為：
網頁中的元素，在操作的時候會有自己的默認行為。比如：右擊文本框輸入區域，會彈出系統菜單、點擊超鏈接會跳轉到指定頁面、點擊提交按鈕會提交數據。
//阻止超鏈接進行跳轉
$('a').click(function (e) {
e.preventDefault();
});
//禁止提交表單跳轉（注意是在form上阻止）
$('form').submit(function (e) {
e.preventDefault();
});
PS： 如果想讓上面的超鏈接同時阻止默認行為且禁止冒泡行為， 可以把兩個方法同時寫上： event.stopPropagation()和 event.preventDefault()。 這兩個方法如果需要同時啟用的時候，還有一種簡寫方案代替，就是直接 return false。
$('a').click(function (e) {
return false;
});
For my lover,
and thank you Mr.Lee!
