HTML <menuitem> 元素

HTML <menuitem> 元素表示用户能够通过弹出菜单调用的命令。这包括上下文菜单，以及可能附加到菜单按钮的菜单。

一个带有上下文菜单的 <div> 元素

<style>
  div {
    width: 300px;
    height: 80px;
    background-color: lightgreen;
  }
</style>

<div contextmenu="popup-menu">
  右键单击以查看调整后的上下文菜单
</div>

<menu type="context" id="popup-menu">
  <menuitem type="checkbox" onclick="toggleOption()" checked="true">Checkbox</menuitem>
  <menuitem type="command" label="Command" icon="icon.png" onclick="doSomething()">Checkbox</menuitem>
  <menuitem type="radio" name="group1" onclick="option()" checked="true">Radio button 1</menuitem>
  <menuitem type="radio" name="group1" onclick="option()">Radio button 2</menuitem>
</menu>

尝试一下 »

命令可以被明确定义，通过文本标签和可选的图标来描述它的外观，或者作为_间接命令_，其行为由单独的元素定义。命令还可以选择包括一个复选框或被分组以共享的单选按钮。

特性

内容类别	无。
允许的内容	无，它是一个empty element.
标签省略	必须有开始标签，不能有结束标签。
允许的父元素	<menu> 元素，其中该元素是 popup menu 状态。（如果指定，<menu> 元素的 type 属性必须是 popup；如果未指定，<menu> 的父元素本身就是 <menu>在 popup up 状态。）
允许的 ARIA 角色	无
DOM 接口	HTMLMenuItemElement

属性

该元素包含了全局属性。特别是 title 可以用来描述命令，或提供使用提示。

checked

指示是否选中该命令的布尔属性。只能在 type 属性为 checkbox 或 radio 时使用。

command

指定单独元素的 ID，指示要间接调用的命令。不能在菜单包含 checked，disabled，icon，label，radiogroup 或 type 的属性的菜单项中使用。

default

该布尔属性表示使用与菜单主题元素（例如 button 或 input）相同的命令。

disabled

表示该命令在当前状态下不可用的布尔属性。

icon

图像 URL，用于提供图像来表示命令。

label

显示给用户的命令名称。当不存在 command 属性时需要指定。

radiogroup

该属性指定选择时要切换为单选按钮的一组命令的名称。只能 type 属性为 radio 时能使用。

type

该属性指示命令的种类，可以是以下三个值之一。

• command：具有关联操作的常规命令。这是缺省的默认值。
• checkbox：表示可以在两种不同状态之间切换的命令。
• radio：表示一组命令中的一个选项，它象单选按钮一样可以切换。

规范

规范	状态	备注
HTML Living Standard <menuitem> 的定义	现行的标准	-
HTML 5.1 <menuitem> 的定义	推荐	-

桌面浏览器兼容性

移动浏览器兼容性

1. 仅适用于通过 contextmenu 属性关联的 <menu> 元素中定义的 <menuitem> 。

2. <menuitem> 元素需要有关闭标签。

3. 该特性由 Enable Experimental Web Platform Features 首选项控制（需要设置为 true）。

相关链接

• Firefox 中的 HTML5 上下文菜单（截图和代码）