El evento HTML DOM oncontextmenu ocurre cuando se hace clic derecho en un elemento para abrir el menú contextual.
Nota: El evento oncontextmenu es compatible con todos los navegadores, pero el atributo contextmenu actualmente solo es compatible con Firefox.
Sintaxis:
HTML:
<element oncontextmenu="myScript">
JavaScript:
object.oncontextmenu = function(){myScript};
En JavaScript, usando el método addEventListener():
object.addEventListener("contextmenu", myScript);
Ejemplo 1: Uso de HTML
<!DOCTYPE html>
<html>
<head>
<style>
div {
background: green;
border: 1px solid black;
padding: 10px;
}
</style>
</head>
<body>
<center>
<h1 style="color:green">
GeeksforGeeks
</h1>
<h2>HTML DOM oncontextmenu Event</h2>
<div oncontextmenu="myFunction()"
contextmenu="mymenu">
<p>Right-click inside the box
</div>
<script>
function myFunction() {
alert("right-clicked");
}
</script>
</center>
</body>
</html>
Salida:
Antes: 
Después: 
Ejemplo 2: Uso de JavaScript
<!DOCTYPE html>
<html>
<head>
<style>
div {
background: green;
border: 1px solid black;
padding: 10px;
}
</style>
</head>
<body>
<center>
<h1 style="color:green">
GeeksforGeeks
</h1>
<h2>HTML DOM oncontextmenu Event</h2>
<div id="myDIV" contextmenu="mymenu">
<p>Right-click inside the box
</div>
<p id="try"></p>
<script>
document.getElementById(
"myDIV").oncontextmenu = function() {
GFGfun()
};
function GFGfun() {
var gfg = document.getElementById("try");
gfg.innerHTML = "right-clicked";
}
</script>
</center>
</body>
</html>
Salida:
Antes:
Después: 
Ejemplo: En JavaScript, usando el método addEventListener():
<!DOCTYPE html>
<html>
<head>
<style>
div {
background: green;
border: 1px solid black;
padding: 10px;
}
</style>
</head>
<body>
<center>
<h1 style="color:green">
GeeksforGeeks
</h1>
<h2>HTML DOM oncontextmenu Event</h2>
<div id="myDIV" contextmenu="mymenu">
<p>Right-click inside the box
</div>
<p id="try"></p>
<script>
document.getElementById(
"myDIV").addEventListener("contextmenu", GFGfun);
function GFGfun() {
var gfg = document.getElementById("try");
gfg.innerHTML = "right-clicked";
}
</script>
</center>
</body>
</html>
Salida:
Antes:
Después:
Navegadores compatibles: los navegadores compatibles con DOM oncontextmenu Event se enumeran a continuación:
- Google Chrome
- explorador de Internet
- Firefox
- safari de manzana
- Ópera
Publicación traducida automáticamente
Artículo escrito por Vijay Sirra y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA