我们可以轻松地通过右键单击创建一个漂亮的自定义菜单。
让我们创建一个div右键单击启用自定义菜单。
Right Click here
要防止默认右键单击菜单，我们需要在head标记中添加以下代码：
$(document).ready(function () {
$("#dv_rc").bind('contextmenu', function (e) {
e.preventDefault();
// prevents default menu
});
});
现在，我们需要为右键菜单制作一个面板：
Right Click Window
请注意style="display:none; "。这背后的原因是在右键单击之前不显示。
现在我们需要在右键单击显示它。
我们在之前添加的jquery中添加了一行代码，以修改CSS，使其显示并定位在单击的右下方。
$("#dv_rc").bind('contextmenu', function (e) {
e.preventDefault();
// prevents native menu from being shown
$("#popupRC").css({ position: "absolute", top: e.pageY,
left: e.pageX, display: "block" });
});
现在添加一些代码，点击close面板按钮关闭此窗口。
完整代码如下：
自定义右击菜单 - 锐客网
Right Click here
Right Click Window【使用Bootstrap制作右键单击自定义菜单】原文地址：https://www.codeproject.com/Tips/1172961/Custom-Menu-With-Right-Click-Using-Bootstrap
推荐阅读
- JavaScript|web前端入门到实战（好用的Js图表库）
- 接口访问加密方式
- 实用技术|Chrome 技术篇-常用web调试手法（清除缓存并硬性重新加载）
- 有关easyUI的拖动操作中droppable，draggable用法例子
- web前端|CSS科技感四角边框
- ColorBox 演示和说明/API
- SUI 列表 底部无限滚动
- js把时间戳转化为时间
- js jq获取标签的各种方式整理
- WEB前端|用HTML5canvas绘制一个圆环形的进度表示