js中滑鼠事件總結

標籤：對象   win   pre   添加   點擊   window   ons   沒有   查看   

js中滑鼠事件主要有onclick，onmousedown，onmouseup，oncontextmenu，ondblclick,所有的這些事件都包含有一個事件對象event，當然在IE低版本下，event對象是掛在window底下的。這個我們另行討論。

　　1.通過html添加事件　

<input type="button" click="alert(1)"/>

　　2.通過DOM0級方式添加事件

<input type="button" value="點擊"/><script>    var btn=document.getElementsByTagName(‘input‘)[0];    btn.onclick=function(){         alert(1);}</script>

　　3.通過DOM2級方式添加事件

　　　　事件監聽主要接受三個參數，事件類型，事件需要執行的函數，是否冒泡，預設情況下是允許冒泡的

document.addEventListener(‘click‘,function( ){ },true)

　以上是關於事件添加的三種方式，通過DOM0級方式添加事件有一個缺點就是當添加同一個事件是，後寫的會把先寫的給覆蓋掉，但是通過DOM2級方式添加的相同事件是不會覆蓋前面的事件的。同時，需要注意的是通過DOM2級添加的事件類型前面是沒有‘on’的，接著就是如果要移除事件的話，DOM0級直接讓事件為null就能清除事件，但是如果是DOM2級添加的函數是匿名函數，通過removeEventListener（）方法是沒辦法移除的，因為兩者指向的不是同一個函數，如果要移除，請記得使用有名函數。關於最後一個參數true是代表冒泡，false是代表捕獲。

 

/*
* 當觸發onclick事件時，console.log(ev.which),滑鼠左鍵的which值為1
* 當觸發oncontextmenue時，滑鼠的右索引值為3，不會觸發onclick事件
* 當mousewheel時，滑鼠的中鍵索引值為0
* 當document.down時，可以根據按鍵的不同，從左至右滑鼠鍵值依次為1,2,3
* 在chrome底下，查看ev.wheelDelta,向上是120，向下是-120
* 在FirFox底下，通過addEventListenner()來給滑鼠添加滾輪事件，事件類型是DOMMouseScroll，查看是使用ev.detail
* 向上是3，向下是-3
*

 

js中滑鼠事件總結