事件物件的使用 jQuery

事件中的event物件容易被初學者忽略掉，可能大多時候初學者不知道怎麼去用它，但有些時候它還是非常有用的

乙個標準的"click"點選事件

$(elem).on("click",function(event))

在不同瀏覽器之間事件物件的獲取, 以及事件物件的屬性都有差異。jquery根據 w3c 標準規範了事件物件，所以在jquery事件**方法中獲取到的事件物件是經過相容後處理過的乙個標準的跨瀏覽器物件

這裡不在千篇一律的說方法的使用，通過實際的乙個小案例，從而來了解事件物件的作用

ul有n個子元素li(這裡只寫了3個)，如果我要響應每乙個li的事件，那麼常規的方法就是需要給所有的li都單獨繫結乙個事件監聽，這樣寫法很符合邏輯，但是同時有顯得繁瑣

因為li都有乙個共同的父元素，而且所有的事件都是一致的，這裡我們可以採用要乙個技巧來處理，也是常說的"事件委託"

事件沒直接和li元素發生關係，而且繫結父元素了。由於瀏覽器有事件冒泡的這個特性，我們可以在觸發li的時候把這個事件往上冒泡到ul上，因為ul上繫結事件響應所以就能夠觸發這個動作了。唯一的問題怎麼才知道觸發的li元素是哪個乙個？

這裡就引出了事件物件了

事件物件是用來記錄一些事件發生時的相關資訊的物件。事件物件只有事件發生時才會產生，並且只能是事件處理函式內部訪問，在所有事件處理函式執行結束後，事件物件就被銷毀

回到上面的問題，既然事件物件是跟當前觸發元素息息相關的，所以我們就能從裡面相關的資訊，從事件物件中找到 event.target

event.target

target 屬性可以是註冊事件時的元素，或者它的子元素。通常用於比較 event.target 和 this 來確定事件是不是由於冒泡而觸發的。經常用於事件冒泡時處理事件委託

簡單來說：event.target代表當前觸發事件的元素，可以通過當前元素物件的一系列屬性來判斷是不是我們想要的元素

事件物件的屬於與方法有很多，但是我們經常用的只有那麼幾個，這裡我主要說下作用與區別

event.type：獲取事件的型別

觸發元素的事件型別

$("a").click(function(event) );

event.pagex 和 event.pagey：獲取滑鼠當前相對於頁面的座標

通過這2個屬性，可以確定元素在當前頁面的座標值，滑鼠相對於文件的左邊緣的位置（左邊）與（頂邊）的距離，簡單來說是從頁面左上角開始,即是以頁面為參考點,不隨滑動條移動而變化

event.preventdefault() 方法：阻止預設行為

這個用的特別多，在執行這個方法後，如果點選乙個鏈結（a標籤），瀏覽器不會跳轉到新的 url 去了。我們可以用 event.isdefaultprevented() 來確定這個方法是否(在那個事件物件上)被呼叫過了

event.stoppropagation() 方法：阻止事件冒泡

事件是可以冒泡的，為防止事件冒泡到dom樹上，也就是不觸發的任何前輩元素上的事件處理函式

event.which：獲取在滑鼠單擊時，單擊的是滑鼠的哪個鍵

event.which 將 event.keycode 和 event.charcode 標準化了。event.which也將正常化的按鈕按下(mousedown 和 mouseupevents)，左鍵報告1，中間鍵報告2，右鍵報告3

event.currenttarget : 在事件冒泡過程中的當前dom元素

冒泡前的當前觸發事件的dom物件, 等同於this.

this和event.target的區別：

js中事件是會冒泡的，所以this是可以變化的，但event.target不會變化，它永遠是直接接受事件的目標dom元素；

.this和event.target都是dom物件

如果要使用jquey中的方法可以將他們轉換為jquery物件。比如this和$(this)的使用、event.target和$(event.target)的使用；