HTML <menuitem> 标签用于定义菜单的菜单项。
HTML menuitem 元素创建一个命令,用户可以通过弹出菜单调用该命令,这包括上下文菜单以及可能与菜单按钮一起附加的菜单。
不再建议使用此标记,因为它已弃用,在 HTML5 中不受支持。
语法
<menuitem label = "" onclick = ""></menuitem>
属性
<menuitem> 标签支持 HTML 的 全局属性 和 事件属性。还接受下面列出的一些特定属性。
属性 | 值 | 描述 |
---|---|---|
checked | checked | d定义应检查 MenuItem(只适用HTML5) |
command | (只适用HTML5) | |
default | default | MenuItem 被标记为默认命令(只适用HTML5) |
disabled | disabled | 禁用 MenuItem,并且无法单击(只适用HTML5) |
icon | url | 定义 MenuItem 的图标(只适用HTML5) |
label | text | 定义向用户显示的 MenuItem 的名称(只适用HTML5) |
radiogroup | groupname | 定义一组命令,其中只能选择一个命令d(只适用HTML5) |
type |
checkbox command radio |
定义 menuItem 的命令类型,默认值为 Command(只适用HTML5) |
HTML<menuitem> 标签用法示例
下面的示例将说明 menuitem 标签的用法。在哪里、何时以及如何使用 menuitem 标签来创建菜单项。示例仅适用于 mozilla firefox。
创建 mnuitem 元素
让我们看一下以下示例,我们将在其中使用 menuitem 标签。
<!Doctype html>
<html>
<head>
<title>HTML menuitem Tag</title>
</head>
<body>
<div style="border:1px solid #000; padding:20px;" contextmenu="clickmenu">
<p>Right click inside here....</p>
<menu type="context" id="clickmenu">
<menuitem label="QikepuCom" onclick=""></menuitem>
</menu>
</div>
</body>
</html>
具有不同 menuitem 的上下文菜单
在以下示例中,我们将使用不同的菜单项创建上下文菜单 - instagram、twitter 和 facebook。
<!Doctype html>
<html>
<head>
<title>HTML menuitem Tag</title>
</head>
<body>
<div style="border:1px solid #000; padding:20px;"
contextmenu="clickmenu">
<p>Right click inside here....</p>
<menu type="context" id="mymenu">
<menuitem label="Refresh"
onclick="window.location.reload();"
icon="ico_reload.png">
</menuitem>
<menu label="Share on...">
<menuitem label="Instagram" icon="ico_instagram.png"
onclick=
"window.open('//instagram.com/sharer/sharer?text=' + window.location.href);">
</menuitem>
<menuitem label="Twitter" icon="ico_twitter.png"
onclick=
"window.open('//twitter.com/intent/tweet?text=' + window.location.href);">
</menuitem>
<menuitem label="Facebook" icon="ico_facebook.png"
onclick=
"window.open('//facebook.com/sharer/sharer.php?u=' + window.location.href);">
</menuitem>
</menu>
<menuitem label="Email This Page"
onclick=
"window.location='mailto:?body='+window.location.href;">
</menuitem>
</menu>
</div>
</body>
</html>
支持的浏览器
浏览器 | ![]() |
![]() |
![]() |
![]() |
![]() |
---|---|---|---|---|---|
是否支持 | No | No | 8.0 | No | No |