你的位置:首页 > Java教程

[Java教程]javascript自定义右键菜单代码

javascript自定义右键菜单代码:

右键菜单这个再熟悉不过了,使用电脑的话每天几乎都要操作上千遍右键菜单,下面分享一段自定义右键菜单的代码实例,希望能够给需要相关内容的朋友带来帮助,代码实例如下:

<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="author" content="http://www.51texiao.cn/" /><title>蚂蚁部落</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;   //解决兼容性  if(aevent.button==2)  {          //当事件属性button的值为2时,表用户按下了右键    document.oncontextmenu=function(aevent)   {     if(window.event)    {      aevent=window.event;      aevent.returnValue=false;     //对IE 中断 默认点击右键事件处理函数     }    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>

以上代码基本实现需要的效果,当然还不够完善,可以自行完善一下即可,只是提供了一种思路而已。

原文地址是:http://www.51texiao.cn/javascriptjiaocheng/2015/0507/885.html

最原始地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=8097