获取或设置当前窗口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;
        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';
};