js中鼠標(biāo)事件主要有onclick,onmousedown,onmouseup,oncontextmenu,ondblclick,所有的這些事件都包含有一個(gè)事件對象event,當(dāng)然在IE低版本下,event對象是掛在window底下的。這個(gè)我們另行討論。
1.通過html添加事件
<input type="button" click="alert(1)"/>
2.通過DOM0級方式添加事件
<input type="button" value="點(diǎn)擊"/><script> var btn=document.getElementsByTagName('input')[0]; btn.onclick=function(){ alert(1);}</script>3.通過DOM2級方式添加事件
事件監(jiān)聽主要接受三個(gè)參數(shù),事件類型,事件需要執(zhí)行的函數(shù),是否冒泡,默認(rèn)情況下是允許冒泡的
document.addEventListener('click',function( ){ },true)以上是關(guān)于事件添加的三種方式,通過DOM0級方式添加事件有一個(gè)缺點(diǎn)就是當(dāng)添加同一個(gè)事件是,后寫的會(huì)把先寫的給覆蓋掉,但是通過DOM2級方式添加的相同事件是不會(huì)覆蓋前面的事件的。同時(shí),需要注意的是通過DOM2級添加的事件類型前面是沒有‘on'的,接著就是如果要移除事件的話,DOM0級直接讓事件為null就能清除事件,但是如果是DOM2級添加的函數(shù)是匿名函數(shù),通過removeEventListener()方法是沒辦法移除的,因?yàn)閮烧咧赶虻牟皇峭粋€(gè)函數(shù),如果要移除,請記得使用有名函數(shù)。關(guān)于最后一個(gè)參數(shù)true是代表冒泡,false是代表捕獲。
/*
* 當(dāng)觸發(fā)onclick事件時(shí),console.log(ev.which),鼠標(biāo)左鍵的which值為1
* 當(dāng)觸發(fā)oncontextmenue時(shí),鼠標(biāo)的右鍵值為3,不會(huì)觸發(fā)onclick事件
* 當(dāng)mousewheel時(shí),鼠標(biāo)的中鍵鍵值為0
* 當(dāng)document.down時(shí),可以根據(jù)按鍵的不同,從左到右鼠標(biāo)鍵值依次為1,2,3
* 在chrome底下,查看ev.wheelDelta,向上是120,向下是-120
* 在FirFox底下,通過addEventListenner()來給鼠標(biāo)添加滾輪事件,事件類型是DOMMouseScroll,查看是使用ev.detail
* 向上是3,向下是-3
*
以上這篇關(guān)于js中的鼠標(biāo)事件總結(jié)就是小編分享給大家的全部內(nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持武林網(wǎng)。
新聞熱點(diǎn)
疑難解答