HTML网页鼠标左键、右键、及左右键同时按下的事件实现

声明一下,如果只是用到鼠标的左键和右键,是不用这么复杂的。这里主要是应用到了鼠标左右键同时按下时产生的事件。也可以从代码中自己重新定义网页的鼠标右键菜单。代码如下:

<!DOCTYPE HTML>
<html>
<head>
<title></title>
</head>
<body >
<div oncontextmenu="textmenuClick()" onmouseup="mouse_up()" onmousedown="mouse_down()">
点击测试
</div>
<input type="text" id="mouse_up" value = "" />
<script type="text/javascript">
var clickValue = 0;
var isFirstUP = false;
function mouse_up() {
if (clickValue == 1) {
if (event.button == 1) {
//=======================在这里写左键事件
document.getElementById("mouse_up").value = "左单键";
//=======================
} else if (event.button == 2) {
//=======================在这里写右键事件
document.getElementById("mouse_up").value = "右单键";
//=======================
}
clickValue = 0;
} else if (clickValue == 2 && !isFirstUP) {
//=======================在这里写双键事件(且是第二个键弹起时触发)
document.getElementById("mouse_up").value = "双?键¨?";
//=======================
clickValue = 0;
}
isFirstUP = false;
}

function mouse_down() {
isFirstUP = true
clickValue ++;
}

function textmenuClick(e) {
//取消网页自带的右键事件
event.returnValue = false;
event.cancelBubble = true;
}
</script>
</body>
</html>

本文非原创,但是出处未知,如有侵权,请告知我

版权声明:
作者:DaPutao
链接:https://putaosi.com/817
来源:葡萄架下
文章版权归作者所有,未经允许请勿转载。

THE END
分享
二维码
打赏
< <上一篇
下一篇>>