js禁止默认的右键菜单或出现自定义右键菜单

1、屏蔽默认的右键菜单

js:

document.getElementById('myimg').oncontextmenu=function(){return false;}

jquery:

$('#myimg').oncontextmenu=function(e){return false;} //not ok

$('#myimg').bind('contextmenu',function(e){return false;}) //ok

 

oncontextmenu在IE6上测试发现也可以。
而下面的mousedown方法则均无效:
.onmousedown=function(e){

  if(e.which==3)  //e.whice=1、2、3,表示按下的分别是鼠标的左键、中键、右键

  return false;   // not ok

}

2、显示自定义的菜单

可预先写好菜单:

<ul id='mymenu' style="display:none;position:fixed;background:white;padding:20px;">

  <li>menu1</li>

  <li>menu2</li>

  <li>menu3</li>

  <li>menu4</li>

</ul>

右键时显示就可以了:

$('#myimg').bind('contextmenu',function(e){

  $('#mymenu').css({display:'block',left:e.clientX,top:e.clientY});

  return false;

})

$('#mymenu').mouseleave(function(){
  $('#mymenu').css('display','none');
})

 

 

你可能感兴趣的:(右键菜单)