鼠标右键事件

项目开发中，会遇到鼠标右键事件。而在使用鼠标右键事件时，需要禁止其默认右键事件，简单实例如下：

1、HTML代码：

 

<div id="wrap"> 
    <p>节目</p> 
    <ul>
        <li>first</li>
        <li>second</li>
    </ul>
</div> 

2、css代码：

html,body{margin: 0;padding: 0;}
#wrap{position: relative;width: 300px;margin: 100px auto 0;}
#wrap p{cursor: pointer;width: 100%;text-align: center;}
#wrap ul{border:1px solid #ccc;box-sizing:border-box;position: absolute;left: 0;top: 20px;display: none;list-style: none;padding: 0;width: 100%;}
#wrap ul li{cursor:pointer;height: 20px;line-height: 20px;text-align: center;}
#wrap ul li:nth-of-type(1){border-bottom: 1px dashed #ccc;}
#wrap ul li:hover{background-color: #ccebf8;}

3、js（jQuery）代码：

 

 

$(function ($) {
  $('#wrap p').on("contextmenu", function () {
    return false;
  });
  $('#wrap p').mousedown(function (event) {
    var event = event || window.event;
    console.log(event.which);
    if (3 == event.which) {
      $('#wrap>ul').show();
    }
  });
  $('#wrap ul>li').click(function () {
    var text = $(this).text();
    $('#wrap p').text(text);
    $('#wrap ul').hide();
  });
});

4、效果图：