Element: contextmenu event

The contextmenu event fires when the user attempts to open a context menu. This event is typically triggered by clicking the right mouse button, or by pressing the context menu key. In the latter case, the context menu is displayed at the bottom left of the focused element, unless the element is a tree, in which case the context menu is displayed at the bottom left of the current row.

Any right-click event that is not disabled (by calling the event's preventDefault() method) will result in a contextmenu event being fired at the targeted element.

Bubbles Yes
Cancelable Yes
Interface MouseEvent
Event handler property oncontextmenu

Examples

In this example, the default action of the contextmenu event is canceled using preventDefault() when the contextmenu event is fired at the first paragraph. As a result, the first paragraph will do nothing when right-clicked, while the second paragraph will show the standard context menu offered by your browser.

HTML

<p id="noContextMenu">The context menu has been disabled on this paragraph.</p>
<p>But it has not been disabled on this one.</p>

JavaScript

noContext = document.getElementById('noContextMenu');

noContext.addEventListener('contextmenu', e => {
  e.preventDefault();
});

Result

Specifications

Specification Status Comment
HTML Living Standard
The definition of 'contextmenu' in that specification.
Living Standard

Browser compatibility

DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
contextmenu eventChrome Full support 1Edge Full support 12Firefox Full support 6IE Full support 9Opera Full support 10.5Safari Full support 3WebView Android Full support 1Chrome Android Full support 18Firefox Android Full support 6Opera Android Full support 11.1Safari iOS Full support 1Samsung Internet Android Full support 1.0

Legend

Full support
Full support

See also