<menuitem>
版本:HTML5废弃
用户可以通过HTML <menuitem> 元素生成一个弹出式菜单。这包括上下文菜单,以及按钮可能附带的菜单。
这个标签可以被显式定义,带有文本标签和可选图标来描述其外观,或者作为一个间接命令,其行为由一个单独的元素定义。命令还可以选择包含复选框或分组共享单选按钮。(<input type="checkbox">
和<input type="radio">
)
内容类别 | None. |
---|---|
允许的内容 | None,这是一个空元素。 |
标签省略 | 必须有开始标签和结束标签。 |
允许的父元素 | The<menu> element, where that element is in thepopup menustate.(If specified,thetype attribute of the<menu> element must bepopup ; if missing, the parent element of the<menu> must itself be a<menu> in thepopup menustate.) |
允许的 ARIA roles | None |
DOM 接口 | HTMLMenuItemElement |
属性
该标签支持全局属性;特别地,title
常常用来描述命令,或者提供有用的注释。
checked
布尔值,指示是否选择了命令。只能作为属性使用在checkbox
或radio
中。command
指定一个单独元素的ID,指示要间接调用的命令。在包含属性的菜单项中也不能使用。checked
、disabled
、icon
、label
、radiogroup
或type
。default
布尔值,表示使用与菜单主题元素相同的命令。(如button
或input
)。disabled
布尔值,表示命令在当前状态下不可用。请注意,禁用与隐藏不同;禁用的属性适用于任何环境变化可能导致命令相关的上下文中。icon
图片URL,用于提供图片来表示命令。label
展示给用户一个命令的名字,当command
属性不存在时是必须的。radiogroup
此属性指定要切换为单选按钮时,选定的一组命令的名称。只能作为radio的属性使用。type
这个属性指定命令的类型,可以为以下三个命令之一。command
:有关联动作的常规命令。这是缺少时的值默认值。checkbox
:代表一个命令可以在两个不同状态之间的切换。radio
:代表一组单选按钮,可切换为命令中的一个选择。
例子
//HTML <!-- a <div> element with a context menu --> <div contextmenu="popup-menu"> right-click to see the adjusted context menu </div> <menu type="context" id="popup-menu"> <menuitem type="checkbox" checked>checkbox</menuitem> <hr> <menuitem type="command" label="this command does nothing" icon="https://developer.cdn.mozilla.net/static/img/favicon144.png"> commands don't render their contents. </menuitem> <menuitem type="command" label="this command has javascript" onclick="alert('command clicked')"> commands don't render their contents. </menuitem> <hr> <menuitem type="radio" radiogroup="group1">radio button 1</menuitem> <menuitem type="radio" radiogroup="group1">radio button 2</menuitem> </menu>
//CSS div { width: 300px; height: 80px; background-color: lightgreen; }