本文實例講述了JavaScript常見鼠標(biāo)事件與用法。分享給大家供大家參考，具體如下：

成都創(chuàng)新互聯(lián)公司是專業(yè)的雷州網(wǎng)站建設(shè)公司，雷州接單;提供網(wǎng)站設(shè)計、成都網(wǎng)站設(shè)計,網(wǎng)頁設(shè)計,網(wǎng)站設(shè)計,建網(wǎng)站,PHP網(wǎng)站建設(shè)等專業(yè)做網(wǎng)站服務(wù);采用PHP框架,可快速的進行雷州網(wǎng)站開發(fā)網(wǎng)頁制作和功能擴展;專業(yè)做搜索引擎喜愛的網(wǎng)站,專業(yè)的做網(wǎng)站團隊,希望更多企業(yè)前來合作!

JavaScript 鼠標(biāo)事件有以下8種

mousedown
鼠標(biāo)的鍵鈕被按下。

mouseup
鼠標(biāo)的鍵鈕釋放彈起。

click
鼠標(biāo)左鍵（或中鍵）被單擊。

事件觸發(fā)順序是：mousedown -> mouseup -> click

dblclick
鼠標(biāo)左鍵（或中鍵）被雙擊。

事件觸發(fā)順序是：mousedown -> mouseup -> click -> mousedown -> mouseup -> click -> dblclick。

contextmenu
彈出右鍵菜單，它可能是鼠標(biāo)右鍵觸發(fā)的，也可能是鍵盤的菜單鍵觸發(fā)的。

mouseover
鼠標(biāo)移動到目標(biāo)上方。

mouseout
鼠標(biāo)從目標(biāo)上方移出。

mousemove
鼠標(biāo)在目標(biāo)上方移動

注意：事件名稱大小寫敏感。若需要監(jiān)聽以上事件，則在事件名的前面加個on即可。

事件區(qū)別

onmouseover、nmouseout：鼠標(biāo)移動到自身時候會觸發(fā)事件，同時移動到其子元素身上也會觸發(fā)事件

onmouseenter、onmouseleave：鼠標(biāo)移動到自身是會觸發(fā)事件，但是移動到其子元素身上不會觸發(fā)事件

全局事件對象event

event.x
事件發(fā)生時鼠標(biāo)的位置

event.y
事件發(fā)生時鼠標(biāo)的位置

button
鼠標(biāo)的哪一個鍵觸發(fā)的事件

0
鼠標(biāo)左鍵
1
鼠標(biāo)中鍵
2
鼠標(biāo)右鍵

代碼范例

這里使用在線HTML/CSS/JavaScript代碼運行工具：http://tools.jb51.net/code/HtmlJsRun測試上述代碼，得到如下運行結(jié)果：

感興趣的朋友可以使用本站在線工具測試一下上述代碼運行效果。

更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《JavaScript操作DOM技巧總結(jié)》、《JavaScript頁面元素操作技巧總結(jié)》、《JavaScript事件相關(guān)操作與技巧大全》、《JavaScript查找算法技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript錯誤與調(diào)試技巧總結(jié)》

希望本文所述對大家JavaScript程序設(shè)計有所幫助。