事件的處理程序在js當中很重要的。事件驅動是js的重要組成部分。在js中,有html中處理程序,dom0級,dom2級 事件處理程序。我們經常用dom0級來綁定事件。比如:
? ? var btn = document.getElementById("btn")
? ? ? ? ? btn.onclick = function () {
? ? ? ? ? ? ? ? alert("點擊事件")
};
直接在元素節點里綁定事件名。element.on+"事件名"=回調函數。我們可以在回調函數體內進行相關操作。在dom0級事件中只能綁定一次事件.
我們在事件程序中,會產生事件對象event.這個很重要的。因為我們可以在事件的回調函數里,傳入事件對象e來進行操作。來可以找到我們需要的對象。比如是e.target和e.currentTarger的區別。還有事件代理事件是我們的經常用到。比如在ajax請求中和for循環,在定時器中,代碼執行的順序,我們要經常關注的頁面加載的時候和代碼執行的時候,我們有時候代碼執行完了,但是數據還沒有出來,我們需要用到的事件委托。具體的語法是在jquery框架我們是經常事件委托。先把事件委托在父級上,可以用實際觸發的子級標簽通過冒泡原理讓父級去觸發執行回調函數,這樣可以讓父級下的所有子級都會有實際觸發的事件,都可以執行回調函數的代碼段,這樣就不需要通過循環來操作給每個子級來添加事件。其實我們主要的目的還是來解決實際觸發的標簽子級的添加新的子級,進行增刪改查。
$("父級標簽").on("事件名","實際觸發的標簽(子級)",function(){
? ? ? ? ?});
我們通過事件的綁定,我們可以進行相關的ui操作。而事件代理模式是很方便的,能減少我們的內存消耗,交互次數。提高我們的加載速度。所以,我們是可以經常用的。需要注意的是,因為事件委托原理是父級來作為事件代理人,而實際觸發的事件的兄弟同級都會有事件觸發函數機制,也就是點擊事件代理人父級下的子級都會觸發事件函數的執行(也就事件回調函數) 。所以,我們要學會運用事件流的相關機制。
在事件對象中,我們對于事件對象enevt的屬性 e.currenTarget 和e.target 還有事件函數的this的指向問題。實際觸發事件對象和this指向的對象是一樣的。即事件綁定的元素上。即 e.currenTarget == this 而e.target是我們目標的對象。即使我們點擊的對象,但不一定是實際觸發的對象。即e.currenTarget !=this.
在jq中,我們的this也用的比較多。在函數中,或者方法中,在事件綁定中。我們都可以用this來指向調用this所在的函數。這樣this綁定的方法和屬性相關的操作。在jq事件的函數中,this指向的是觸發事件的標簽而不是$("元素”)的對象。這一點是最重要的。當然,我們可以在jq所封裝的方法里用this。對象的方法,函數體,封裝的插件都可以用到this。是很方便。在this改變 指針方法中,有call() 和$.proxy() 方法。在jq中,$.proxy()方法中,有兩個參數,第一參數是改變this的函數名。第二個參數是要改變this指針的新對象。$(show,document)(1,2)調用函數的執行,并且傳參。所以,在$()后面用小括號來表示調用函數。并且在小括號內可以傳參。這兩種方法都可以改變this指針。最后一種方法比較清晰一些,邏輯性比價強。可以比較清楚的看清邏輯性。在this指針下,我們很可能有誤解,總結this的用法就是this只有在代碼執行的時候,我們才能確定this的指向。我們需要記住一句話就是調用執行this所在的函數的對象,就是this指向的對象。這是我們判斷的this指針的主要方法,匿名函數中的this指針是指向window的對象。在事件函數中,this指向的是觸發事件的或者是說綁定事件函數的標簽。在jq中特別注意。在事件函數中再嵌套函數的話,this指向的是window。這個我們要注意的。