一、鼠標(biāo)事件：

    onclick //點(diǎn)擊
    onmouseout //移出 
    onmouseover //移入
    onmouseenter //移入
    onmouseleave //移出
    ondblclick //雙擊
    oncontextmenu:鼠標(biāo)右鍵
    onmousemove //移動(dòng)
    onmousedown //按下
    onmouseup //抬起

注意：鼠標(biāo)移入移出事件：（是同一個(gè)div觸發(fā)的時(shí)候）
over和out會(huì)在鼠標(biāo)從父級(jí)移入子級(jí)元素的時(shí)候觸發(fā)
enter和leave只有在移入和移出父級(jí)和子級(jí)整體的時(shí)候才會(huì)觸發(fā)

redDiv.onmouseout=function(){
    console.log("out鼠標(biāo)移出")
}
redDiv.onmouseover=function(){
    console.log("over鼠標(biāo)移入")
}
redDiv.onmouseenter=function(){
    console.log("enter鼠標(biāo)移入")
}
redDiv.onmouseleave=function(){
    console.log("leave鼠標(biāo)移出")
}
  鼠標(biāo)移入父級(jí)，觸發(fā)enter和over
  從父級(jí)移到子級(jí)，父級(jí)out，子級(jí)over
  鼠標(biāo)移出父級(jí)和子級(jí)的整體時(shí)觸發(fā)leave

二、鍵盤事件

onkeydown 
onkeyup
onkeypress

輸入框可以添加鍵盤事件，只有成為焦點(diǎn)的時(shí)候才會(huì)觸發(fā)鍵盤事件

三、表單事件

onchange:內(nèi)容發(fā)生變化（前提是失去焦點(diǎn)后）
onblur:失去焦點(diǎn)
onfocus:獲得焦點(diǎn)
oninput:輸入框內(nèi)容發(fā)生變化時(shí)觸發(fā)，實(shí)時(shí)觸發(fā)
onsubmit:表單提交時(shí)觸發(fā)
onreset:表單重置時(shí)觸發(fā)

屏幕快照 2017-10-12 下午4.45.30.png

五、獲取事件對(duì)象event

    redDiv.onmousemove(ev){
       var ev =window.event||ev; //兼容
    }

四、阻止默認(rèn)事件

return false;
ev.returnValue=false;
ev.preventDefault();

五、滾輪事件
谷歌/IE：onmousewheel
ev.wheelDelta ：滾動(dòng)一格數(shù)值120 上正下負(fù)

火狐：DOMMouseScroll
ev.detail：滾動(dòng)一格數(shù)值為1 下正上負(fù)

兼容寫法:

function addMouseWheel(el,fn){
    if(navigator.userAgent.indexOf("Firefox")!=-1){
        //火狐
        el.addEventListener("DOMMouseScroll",fn,false)
    }else{
        //谷歌 IE
        el.onmousewheel=fn;
    }       
}