浏览器原生不支持右键子菜单，需用dom+css+js模拟：监听contextmenu、preventdefault、动态定位弹出div；子菜单通过hover/click触发嵌套元素显示，定位用pagex/y并计算偏移；移动端需长按模拟；display:none优于visibility:hidden；z-index逐级递增；必须支持arrowright/left、escape及tabindex键盘导航。
右键菜单里加子菜单，浏览器原生不支持
HTML 标准的 contextmenu 事件本身不提供任何菜单渲染能力，更没有“子菜单”概念。所谓“右键菜单子菜单”，全是用 DOM + CSS + JS 模拟出来的。别指望靠 <menu></menu> 或 <command></command>（已废弃）实现多级——它们在现代浏览器里基本没用。
用 event.preventDefault() 拦住默认右键，再手动定位弹出 DOM
核心逻辑就三步：监听 contextmenu、阻止默认行为、动态创建并定位一个 <div class="menu">。子菜单只是这个 <code><div> 里的嵌套 <code><ul></ul> 或另一层 <div class="submenu">，靠 hover 或 click 触发显示。
<p>关键点：</p>
<ul>
<li>定位必须用 <code>event.pageX/event.pageY，不是 clientX/clientY（后者不包含滚动偏移）
contextmenu 事件在 iOS Safari 上默认被禁用，需加 touchstart + 长按模拟
display: none 和 visibility: hidden 别混用
子菜单初始状态建议用 display: none，而不是 visibility: hidden。前者不占布局流、不影响父容器尺寸计算；后者仍参与布局，容易导致父菜单高度异常、定位偏移。CSS 中对子菜单的显隐控制应只通过 JS 切换 class，例如：
.submenu { display: none; }
.show { display: block; }
同时注意 z-index 层级：主菜单、子菜单、子子菜单要逐级 +1，否则下拉时会被上层遮住。
键盘操作支持不能漏——尤其是 ArrowRight 和 Escape
纯鼠标操作的右键菜单在无障碍和快捷键场景下几乎不可用。真实项目里至少得补上：
- 焦点进入主菜单后，
ArrowRight键展开当前项的子菜单 -
ArrowLeft键收起当前子菜单并返回上级 -
Escape键逐级关闭所有打开的子菜单，最后隐藏整个菜单 - 每个菜单项加
tabindex="0"，确保可聚焦
这些逻辑不难写，但漏掉一个就会让键盘用户卡死在某一级子菜单里——这是上线后最容易被忽略的兼容性硬伤。
