js 区分鼠标点的是左键还是右键以及屏蔽右键菜单

最新推荐文章于 2025-11-28 04:56:28 发布

最新推荐文章于 2025-11-28 04:56:28 发布 · 186 阅读

文章标签：

#xhtml #javascript #ViewUI

本文详细介绍了鼠标按键事件的区分与应用，包括不同按键的标识符和使用场景，如事件.button的值对应的不同按键操作，以及如何通过事件监听实现特定功能，如禁用右键菜单。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>鼠标键值的区分</title>

</head>

<body>
<div id="a">
event.button==0 默认。没有按任何按钮。<br />
event.button==1 鼠标左键 <br />
event.button==2 鼠标右键 <br />
event.button==3 鼠标左右键同时按下<br />
event.button==4 鼠标中键 <br />
event.button==5 鼠标左键和中键同时按下<br />
event.button==6 鼠标右键和中键同时按下 <br />
event.button==7 所有三个键都按下 <br />
event 要是这个在运行时报错的话就用这个window.event<br />
document.oncontextmenu=function(){return false;} 右键菜单不显示<br />

</div>
<script type="text/javascript">
var a = document.getElementById("a");
a.onmousedown=function(){
if(event.button == 1){
alert("按下鼠标左键");
}
if(event.button == 2){
alert("鼠标右键");
}
if(event.button == 3){
alert("鼠标左右键同时按");
}
if(event.button == 4){
alert("鼠标中键");
}
if(event.button == 5){
alert("鼠标左键和中键同时按下");
}
if(event.button == 6){
alert("鼠标右键和中键同时按下");
}
if(event.button == 7){
alert("所有三个键都按下");
}
}

</script>
</body>
</html>