綁定事件處理函數(shù)的方法
1维贺、ele.onxxx = function (){}
兼容性好，但是一個(gè)元素的同一事件只能綁定一個(gè)處理函數(shù)
基本等同于寫(xiě)在HTML行間
2、ele.addEventListener(etype,fn,false);
IE9以下不兼容」绕牛可以為一個(gè)事件綁定多個(gè)處理程序，但是如果處理函數(shù)的指向同一個(gè)函數(shù)辽聊，則只會(huì)執(zhí)行一次
此時(shí)傳遞的參數(shù)為false纪挎，意思為事件傳遞機(jī)制為冒泡，如果為true則為捕獲
3跟匆、ele.attachEvent('on' + etype,fn)
IE獨(dú)有异袄，一個(gè)事件可以綁定多個(gè)處理程序
//封裝出一個(gè)兼容性的添加事件方法addEvent
/**
* [addEvent 為指定元素添加事件]
* @param {[element]} ele [指定元素]
* @param {[string]} type [事件類(lèi)型]
* @param {[fn]} handle [綁定的處理函數(shù)]
*/
function addEvent(ele,type,handle){
if(ele.addEventListener){
ele.addEventListener(type,handle,false);
}else if(ele.attactEvent){
ele.attactEvent('on' + type,function(){
handle.call(ele);
})
}else{
ele['on' + type] = handle;
}
}
解除事件處理程序
1、ele.onclick = false/""/null
2玛臂、ele.removeEventListener(type,fn,false)
3烤蜕、ele.detach.Event('on' + type,fn)
如果綁定的是匿名函數(shù)，則無(wú)法解除
事件處理模型——事件冒泡和捕獲
冒泡：結(jié)構(gòu)上嵌套關(guān)系的元素迹冤，會(huì)存在事件冒泡的功能讽营，即同一事件，子元素冒泡向父元素泡徙；
捕獲：結(jié)構(gòu)上嵌套關(guān)系的元素橱鹏，會(huì)存在事件的捕獲功能，即同一事件，自父元素向子元素捕獲莉兰；
IE中沒(méi)有捕獲
觸發(fā)順序挑围，如果一個(gè)元素同時(shí)存在冒泡和捕獲事件，先捕獲糖荒，后冒泡杉辙，點(diǎn)擊的元素兩個(gè)事件誰(shuí)寫(xiě)在上面誰(shuí)先執(zhí)行
部分事件不冒泡：focus，blur寂嘉，change奏瞬，submit枫绅，reset泉孩，select等無(wú)法傳遞的事件
取消冒泡的方法
event.stopPropagation()
不支持IE9以下版本
IE獨(dú)有方法 event.cancelBubble = true;
//封裝一個(gè)取消冒泡的函數(shù)stopBubble(event)
/**
* [stopBubble 取消事件冒泡]
* @param {[event]} event [要取消冒泡的事件]
* @return {[type]} [無(wú)返回值]
*/
function stopBubble(event){
if(event.stopPropagation){
event.stopPropagation();
}else{
event.cancelBubble = true;
}
}
阻止默認(rèn)事件
（默認(rèn)事件例如：表單提交、a標(biāo)簽跳轉(zhuǎn)并淋、右擊菜單欄）
1寓搬、return false; 以對(duì)象屬性的方式注冊(cè)的事件才有效 exp:ele.onclick = function (){return false;}
2、event.preventDefault();IE9以下不兼容
3县耽、event.returnValue = false; 兼容IE
//封裝一個(gè)兼容的阻止默認(rèn)事件的方法
/**
* [cancelHandler 阻止事件的默認(rèn)行為]
* @param {[event]} event [要阻止默認(rèn)行為的事件]
* @return {[type]} [無(wú)返回值]
*/
function cancelHandler(event){
if(event.preventDefault){
event.preventDefault();
}else{
event.returnValue = false;
}
}
事件對(duì)象
event || window.event
window.event適用于IE
事件源的對(duì)象
event.target 火狐只有這個(gè)句喷，chrom有這個(gè)
event.srcElement IE只有這個(gè)，chrom有這個(gè)
兼容性寫(xiě)法:
target = event.target || event.srcElement
各類(lèi)事件及簡(jiǎn)要介紹
鼠標(biāo)事件
click , mousedown , mousemove , mouseup , contextmenu , mouseover , mouseout , mouseenter , mouseleave
mousedown + mouseup = click
用button來(lái)區(qū)分鼠標(biāo)的按鍵兔毙，0/1/2 左鍵/滾輪/右鍵
DOM3標(biāo)注規(guī)定：click事件只能監(jiān)聽(tīng)鼠標(biāo)左鍵唾琼，只能通過(guò)mousedown和mouseup事件來(lái)監(jiān)聽(tīng)鼠標(biāo)右鍵
解決mousedown和click沖突的問(wèn)題，可以判斷點(diǎn)擊的事件長(zhǎng)短澎剥，在外部添加一個(gè)blur變量锡溯，如果大于一定的值解除click事件(改變blur值)，在click事件內(nèi)部判斷blur值
鍵盤(pán)事件
keydown 哑姚， keyup 祭饭， keypress
keydown > keypress > keydown
keydown和keypress的區(qū)別：
keydown可以相應(yīng)任何鍵盤(pán)按鍵，keypress只可相應(yīng)字符類(lèi)鍵盤(pán)按鍵
keypress返回ASCII碼叙量，可以轉(zhuǎn)換為相應(yīng)的字符倡蝙，keydown返回規(guī)定鍵盤(pán)按鍵編號(hào)
文本操作事件
input， focus 绞佩， blur寺鸥，change
input 在字符輸入時(shí)候就觸發(fā)
change 在文本框失去焦點(diǎn)時(shí)才對(duì)比前后值觸發(fā)事件
