javascript-默認行為/右鍵菜單
阿新 • • 發佈：2017-06-20
javascript-默認行為/右鍵菜單
1、自定義右鍵菜單
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css" media="screen">
#div1 {width: 100px;height: 100px;border: 1px solid #000;position: absolute;background: #CCC;display: none;}
</style>
<script>
//阻止默認事件：右鍵菜單
// document.oncontextmenu=function () {
// return false
// }
function getPos(ev) {
var scrollTop=document.documentElement.scrollTop||document.body.scrollTop
var scrollLeft=document.documentElement.scrollLeft||document.body.scrollLeft
return {x:ev.clientX+scrollLeft,y:ev.clientY+scrollTop}
}
document.oncontextmenu=function (ev) {
var oe=ev||event
var od=document.getElementById(‘div1‘)
od.style.display=‘block‘
var odpos=getPos(ev)
od.style.left=odpos.x+‘px‘
od.style.top=odpos.y+‘px‘
return false
}
document.onclick=function () {
var od=document.getElementById(‘div1‘)
od.style.display=‘none‘
}
</script>
</head>
<body>
<div id="div1">
<ul>
<li>新建</li>
<li>刷新</li>
<li>關閉</li>
<li>查看</li>
</ul>
</div>
</body>
</html>javascript-默認行為/右鍵菜單