获取或设置当前窗口contextmenu事件的事件处理函数

在浏览器中 鼠标右键点击会显示默认的 自带的菜单，那么如何禁止 和更改呢？

1) 禁止右键

window.oncontextmenu = funcRef;　　

funcRef是个函数引用 　　　　

举例说明：

window.oncontextmenu = function () {

　 return false; 　

} 　　

该窗口禁止使用右键 

2)更改 （自定义右键菜单）

html结构

 <ul id="menu">
     <li>重命名</li>
     <li>删除</li>
     <li>移动到</li>
     <li class="more">更多 >
         <ul>
             <li>二级菜单</li>
             <li>二级菜单</li>
             <li>二级菜单</li>
             <li>二级菜单</li>
         </ul>
     </li>
 </ul>

css样式

 ul{
         list-style: none;
         padding: 0;
         border:1px solid #000;
         border-bottom: none;
         width:200px;
         position: absolute;
          display: none;
   }
  li{
         line-height: 20px;
         padding:5px;
         border-bottom:1px solid #000;
         position: relative;
     }

javaScript

右键点击事件： oncontextmenu

获取元素

var menu = document.querySelector('#menu');

var more = menu.querySelectorAll('.more');

如果更多有内容就显示出来

   for(var i=0,l=more.length;i<l;i++){
         more[i].onmouseover = function(){
             var ul = this.querySelector('ul');
             ul.style.display = 'block';
             ul.style.left = this.offsetWidth+'px';
             ul.style.top = 0;
   };
  more[i].onmouseout = function(){
             var ul = this.querySelector('ul');
             ul.style.display = 'none';
         };
   }

设置右键菜单

 document.oncontextmenu = function(ev){

   var ev = ev||event;
   ev.preventDefault();//阻止默认行为

   var x = ev.clientX;// 获取鼠标位置
   var y = ev.clientY;

   menu.style.display = 'block';
   menu.style.left = x+'px';
  menu.style.top = y+'px';

  };

点击取消右键菜单

document.onclick = function(){
   menu.style.display = 'none';
};