js事件的機制

1、html事件處理程式

按鈕1

2、dom0級事件處理程式

按鈕2

document.getelementbyid("btn2").onclick=function();        
document.getelementbyid("btn2").onclick=null;    //
取消事件

3、dom2級事件處理程式 優點支援多個事件繫結

按鈕3

事件物件 eventutil.addhandler(document.getelementbyid("btn3"),'click',btn3);

function

btn3(event)

冒泡機制 ：當你點選btn3的時候會呼叫btn3函式和box函式。事件從button冒泡到div上

按鈕3

function
btn3(event)
function
box()
eventutil.addhandler(document.getelementbyid("btn3"),'click',btn3);
eventutil.addhandler(document.getelementbyid("box"),'click',box);

阻止事件冒泡：通過event.stoppropagation();實現

按鈕3

function
btn3(event)
function
box()
eventutil.addhandler(document.getelementbyid("btn3"),'click',btn3);
eventutil.addhandler(document.getelementbyid("box"),'click',box);

阻止事件的預設行為，event.preventdefault();這樣點選go，就不會發生跳轉了

go

function
stopgo(event)
eventutil.addhandler(document.getelementbyid("go"),'click',stopgo);

相容性問題封裝到evenutil中

getevent:function

(event)
,gettype:
function
(event)
,getelement:
function
(event)
,preventdefault:
function
(event)
else
},stoppropagation:
function
(event)
else
}

eventutil.addhandler(document.getelementbyid("go"),'click',function(e));

js的事件機制

js的事件機制 解釋 當我們的行為動作滿足了一定的條件後，會觸發某事務的執行。內容 1.單雙擊事件 單擊 onclick 當滑鼠單擊時候會觸發 雙擊 ondbclick 當滑鼠雙擊時候會觸發 2.滑鼠事件 onmouserover 當滑鼠懸停在某個html元素上的時候觸發 onmousermove ...

JS中的事件機制

1 事件的觸發和傳播 事件被使用者輸入系統觸發，並按照dom依次向上傳播。這是兩種行為，瀏覽器提供了兩種方式來控制，即preventdefault 取消事件觸發 stoppropagation 取消事件傳播 所以jquery對兩種行為的控制是分開的，具體如下圖。2 自定義事件 js中事件分兩種型別，...

js的事件機制二

js的事件機制二 1.給合適的html標籤新增合適的事件 onchange select下拉框 onload body標籤 單雙擊 使用者會進行點選動作的html元素 滑鼠事件 使用者會進行滑鼠移動的操作的 鍵盤事件 使用者會進行鍵盤操作的html元素 2.給html新增多個事件時，注意事件的衝突 ...