代码描述:javascript 自定义右键菜单。javascript自定义右键菜单
右键菜单这个再熟悉不过了,使用电脑的话每天几乎都要操作上千遍右键菜单,下面分享一段自定义右键菜单的代码实例,希望能够给需要相关内容的朋友带来帮助,代码实例如下:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.51texiao.cn/" /> <title>51前端</title> <style type="text/css"> #d1{ width:100px; height:200px; background-color:green; display:none; } #dl a{ display:block; } </style> <script type="text/javascript"> window.onload=function(){ rightmenu('p1','d1'); } function rightmenu(elementID,menuID){ var menu=document.getElementById(menuID); //获取菜单对象 var element=document.getElementById(elementID);//获取点击拥有自定义右键的 元素 //设置该元素的 按下鼠标右键右键的 处理函数 element.onmousedown=function(aevent){ //解决兼容性 if(window.event)aevent=window.event; //当事件属性button的值为2时,表用户按下了右键 if(aevent.button==2){ document.oncontextmenu=function(aevent){ if(window.event){ aevent=window.event; //对IE 中断 默认点击右键事件处理函数 aevent.returnValue=false; } else{ aevent.preventDefault();//对标准DOM 中断 默认点击右键事件处理函数 } } menu.style.cssText='display:block;top:'+aevent.clientY+'px;'+'left:'+aevent.clientX+'px;' //将菜单相对 鼠标定位 } } menu.onmouseout=function(){ //设置 鼠标移出菜单时 隐藏菜单 setTimeout(function(){menu.style.display="none";},400); } } </script> </head> <body> <p id="p1">对我右键出现菜单</p> <div id="d1"> <a>剪切</a> <a>复制</a> <a>粘贴</a> </div> </body> </html>
请绑定手机号,在继续操作
注意:只有绑定手机以后,才可使用网站全部功能