jquery.ui-contextmenu


> A jQuery plugin that provides a context menu (based on the standard [jQueryUI menu] widget).

* Define menus from

element or definition list (i.e.
[{title: "Paste", cmd: "paste"}, ...]).
* Themable using jQuery ThemeRoller.
* Supports delegation (i.e. can be bound to elements that don't exist at the
time the context menu is initialized).
* Optional support for touch devices.




Status

The latest release is available at npm Registry:
``shell
$ npm install ui-contextmenu
`

![GitHub version](https://github.com/mar10/jquery-ui-contextmenu/releases/latest)
See also the Change Log.




Demo

Live demo page:

![sample ](http://wwwendt.de/tech/demo/jquery-contextmenu/demo/ "Live demo")

See also the unit tests and live examples

More:

* Play with jsFiddle or
Plunker
* Run the unit tests.




Getting Started

First, include dependencies:

* jQuery 1.7+ (1.10 or later recommended)
* jQuery UI 1.9+ (at least core, widget, menu), 1.11+ recommended
* One of the ThemeRoller CSS themes or a custom one
* jquery.ui-contextmenu.js (also available as CDN on
jsDelivr,
cdnjs, or
UNPKG)

`html





`

Assume we have some HTML elements that we want to attach a popup menu to:

`html




AAA


BBB


CCC



`

Now we can enable a context menu like so:

`js
$("#container").contextmenu({
delegate: ".hasmenu",
menu: [
{title: "Copy", cmd: "copy", uiIcon: "ui-icon-copy"},
{title: "----"},
{title: "More", children: [
{title: "Sub 1", cmd: "sub1"},
{title: "Sub 2", cmd: "sub1"}
]}
],
select: function(event, ui) {
alert("select " + ui.cmd + " on " + ui.target.text());
}
});
``

Alternatively we can

initialize the menu from embedded <ul> markup.

For more information:

* Read the Tutorial and
API Reference
* Have a look at the Live demo page
* Ask questions on Stackoverflow
* Play with jsFiddle or
Plunker




Credits

Thanks to all contributors.




Browser Status Matrix



[jQueryUI menu]: http://jqueryui.com/menu/