原文链接：https://nowtime.cc/html5/897.html
在线预览：https://nowtime.cc/mdui/contextmenu.html
实现代码（JavaScript 部分）：
var $$ = mdui.JQ;
//监听鼠标右击事件 / 移动端长按事件
$$(document).on('contextmenu', function (e) {
// console.log(e);
//0：移动端长按（iOS 测试未通过）
//2：电脑端右键
if(e.button === 2 || e.button === 0) {
e.preventDefault();//阻止冒泡，阻止默认的浏览器菜单
//（修改了这里）鼠标点击位置，相对于页面
var _x = e.pageX,
_y = e.pageY;
let $div = $$("<div></div>").css({
position: 'absolute',
top: _y+'px',
left: _x+'px',
});
$$('body').append($div);//创建临时DOM
// anchorSelector 表示触发菜单的元素的 CSS 选择器或 DOM 元素
// menuSelector 表示菜单的 CSS 选择器或 DOM 元素
// options 表示组件的配置参数，见下面的参数列表
// 完整文档列表：https://mdui.org/docs/menu.html
var inst = new mdui.Menu($div, '#menu');
inst.open();//打开菜单栏
$div.remove();//销毁创建的临时DOM
}
});
HTML 部分：
<ul class="mdui-menu" id="menu">
<li class="mdui-menu-item">
<a href="javascript:;" class="mdui-ripple">Refresh</a>
</li>
<li class="mdui-menu-item">
<a href="javascript:;" class="mdui-ripple">Settings</a>
</li>
<li class="mdui-menu-item">
<a href="javascript:;" class="mdui-ripple">Send feedback</a>
</li>
<li class="mdui-menu-item">
<a href="javascript:;" class="mdui-ripple">Help</a>
</li>
<li class="mdui-menu-item">
<a href="javascript:;" class="mdui-ripple">Signout</a>
</li>
</ul>
@xcg340122 我这测试好像没发现你的问题（Chrome 切换“手机视图”，鼠标右击是会出现在左上角，但这可能并不是 BUG，因为遇到移动端触发菜单是长按时才会触发，未考虑到鼠标右击清空
其实是有BUG的，当快速右击或者左击获取的x或y会变成0，这时候菜单是在左上角出现的，解决办法是做一个额外的获取判断
var scrollX = document.documentElement.scrollLeft || document.body.scrollLeft;
var scrollY = document.documentElement.scrollTop || document.body.scrollTop;
//（修改了这里）鼠标点击位置，相对于页面
var _x = e.pageX || e.clientX + scrollX,
var _y = e.pageY || e.clientY + scrollY;
if(_x == 0 || _y == 0){
return;
}
在“发布”按钮右边找到“代码块”按钮（悬浮在按钮上时，会有提示），点击即可。
B I | T <> !三 !三 | 🔗 🖼
^---This one!!!