HTML - <menuitem> tag

HTML <menuitem> tag is used for defining a menu item for a menu.

HTML menuitem element creates a command that user can invoke through a popup menu and this includes context menu as well as menus that might be attached with menu button.

This tag is no longer recommended as it is deprecated and not supported in the HTML5.

Syntax

<menuitem label = "" onclick = ""></menuitem>

Attribute

HTML menuitem tag supports Global and Event attributes of HTML. Accepts some specific attributes as well which are listed below.

Attribute	Value	Description
checked	checked	defines that a menuitem should be checked
command
default	default	a menuitem is marked as a default command
disabled	disabled	disables a menuitem and cannot be clicked
icon	url	defines an icon for a menuitem
label	text	defines a name for a menuitem which is displayed to the user
radiogroup	groupname	defiens a group of commands out of which only one can be selected
type	checkbox command radio	defines type of command for a menuitem default is command

Examples og HTML menuitem Tag

Bellow examples will illustrate the usage of menuitem tag. Where, when and how to use menuitem tag to create menu items. Examples will work on mozilla firefox only.

Create mnuitem Element

Let's look at the following example, where we are going to use the menuitem tag.

<!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="Tutorialspoint" onclick=""></menuitem>
        </menu>
 
    </div>
</body>
 
</html>

Context menu with different menuitem

In the following example we will create context menu with different menuitems as - instagram, twitter, and 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>

Supported Browsers

Tag
menuitem	No	No	Yes 8.0(Context Menus)	No	No

html_deprecated_tags.htm