Le clic droit est-il un événement Javascript?

Le clic droit est-il un événement Javascript? Si oui, comment l'utiliser?

Comme d'autres l'ont mentionné, le bouton droit de la souris peut être détecté via les événements habituels de la souris (mousedown, mouseup, click) . Cependant, si vous recherchez un événement de déclenchement lorsque le menu contextuel s'affiche, vous ne cherchez pas au bon endroit. Le menu contextuel / clic droit est également accessible via le clavier (Maj + F10 ou touche de menu contextuel sous Windows et certains Linux). Dans cette situation, l'événement que vous recherchez est oncontextmenu:

window.oncontextmenu = function ()
{
    showCustomMenu();
    return false;     // cancel default menu
}

En ce qui concerne les événements de souris eux-mêmes, les navigateurs définissent une propriété sur l'objet événement accessible à partir de la fonction de gestion des événements:

document.body.onclick = function (e) {
    var isRightMB;
    e = e || window.event;

    if ("which" in e)  // Gecko (Firefox), WebKit (Safari/Chrome) & Opera
        isRightMB = e.which == 3; 
    else if ("button" in e)  // IE, Opera 
        isRightMB = e.button == 2; 

    alert("Right mouse button " + (isRightMB ? "" : " was not") + "clicked!");
} 

window.oncontextmenu - MDC

jetez un œil au code jQuery suivant:

$("#myId").mousedown(function(ev){
      if(ev.which == 3)
      {
            alert("Right mouse button clicked on element with id myId");
      }
});

La valeur de whichsera:

• 1 pour le bouton gauche
• 2 pour le bouton du milieu
• 3 pour le bouton droit

Vous pouvez utiliser l'événement window.oncontextmenu, par exemple:

window.oncontextmenu = function () {
  alert('Right Click')
}

<h1>Please Right Click here!</h1>

Oui, bien que w3c indique que le clic droit peut être détecté par l'événement de clic, onClick n'est pas déclenché par un clic droit dans les navigateurs habituels.

En fait, un clic droit ne déclenche que onMouseDown onMouseUp et onContextMenu.

Ainsi, vous pouvez considérer "onContextMenu" comme l'événement de clic droit. C'est une norme HTML5.0.

Si vous souhaitez détecter un clic droit de la souris, vous ne devez pas utiliser la MouseEvent.whichpropriété car elle n'est pas standard et il y a une grande incompatibilité entre les navigateurs. (voir MDN ) Vous devriez plutôt utiliser MouseEvent.button. Il renvoie un nombre représentant un bouton donné:

• 0: Bouton principal enfoncé, généralement le bouton gauche ou l'état non initialisé
• 1: Bouton auxiliaire enfoncé, généralement le bouton de la roue ou le bouton du milieu (si présent)
• 2: Bouton secondaire enfoncé, généralement le bouton droit
• 3: Quatrième bouton, généralement le bouton Précédent du navigateur
• 4: Cinquième bouton, généralement le bouton Suivant du navigateur

MouseEvent.button gère plus de types d'entrée que la souris standard:

Les boutons peuvent être configurés différemment de la disposition standard «de gauche à droite». Une souris configurée pour une utilisation gaucher peut avoir les actions des boutons inversées. Certains périphériques de pointage n'ont qu'un seul bouton et utilisent le clavier ou d'autres mécanismes d'entrée pour indiquer les paramètres principal, secondaire, auxiliaire, etc. D'autres peuvent avoir de nombreux boutons mappés à différentes fonctions et valeurs de bouton.

Référence:

1. https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/which
2. https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/button

Non, mais vous pouvez détecter quel bouton de la souris a été utilisé dans l'événement "onmousedown" ... et à partir de là, déterminer s'il s'agissait d'un "clic droit".

Le code suivant utilise jQuery pour générer un rightclickévénement personnalisé basé sur la valeur par défaut mousedownet les mouseupévénements. Il considère les points suivants:

• déclenchement sur souris
• déclencher uniquement lorsque vous appuyez sur le bouton de la souris sur le même élément avant
• ce code fonctionne surtout aussi dans JFX Webview (puisque l' contextmenuévénement n'y est pas déclenché)
• il ne déclenche pas lorsque la touche contextmenu du clavier est pressé (comme la solution la - on('contextmenu', ...)t

$(function ()
{ // global rightclick handler - trigger custom event "rightclick"
	var mouseDownElements = [];
	$(document).on('mousedown', '*', function(event)
	{
		if (event.which == 3)
		{
			mouseDownElements.push(this);
		}
	});
	$(document).on('mouseup', '*', function(event)
	{
		if (event.which == 3 && mouseDownElements.indexOf(this) >= 0)
		{
			$(this).trigger('rightclick');
		}
	});
	$(document).on('mouseup', function()
	{
		 mouseDownElements.length = 0;
	});
    // disable contextmenu
    $(document).on('contextmenu', function(event)
	{
		 event.preventDefault();
	});
});



// Usage:
$('#testButton').on('rightclick', function(event)
{
  alert('this was a rightclick');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="testButton">Rightclick me</button>

Oui, ça l'est!

function doSomething(e) {
    var rightclick;
    if (!e) var e = window.event;
    if (e.which) rightclick = (e.which == 3);
    else if (e.button) rightclick = (e.button == 2);
    alert('Rightclick: ' + rightclick); // true or false
}

Oui, oncontextmenu est probablement la meilleure alternative, mais sachez qu'il se déclenche lorsque la souris est enfoncée tandis que le clic se déclenche lorsque la souris est relevée.

D'autres questions connexes portaient sur le double clic droit - qui n'est apparemment pas pris en charge sauf par la vérification manuelle du minuteur. Une des raisons pour lesquelles vous voudrez peut-être pouvoir faire un double-clic droit est si vous avez besoin / souhaitez prendre en charge la saisie de la souris par la gauche (inversion de bouton). Les implémentations du navigateur semblent faire beaucoup d'hypothèses sur la façon dont nous devrions utiliser les périphériques d'entrée disponibles.

Le moyen le plus simple de faire un clic droit est d'utiliser

 $('classx').on('contextmenu', function (event) {

 });

Cependant, ce n'est pas une solution multi-navigateurs, les navigateurs se comportent différemment pour cet événement, en particulier Firefox et IE. Je recommanderais ci-dessous pour une solution multi-navigateurs

$('classx').on('mousedown', function (event) {
    var keycode = ( event.keyCode ? event.keyCode : event.which );
    if (keycode === 3) {
       //your right click code goes here      
    }
});

C'est le moyen le plus simple de le déclencher, et cela fonctionne sur tous les navigateurs à l'exception des vues Web d'application comme (CefSharp Chromium etc ...). J'espère que mon code vous aidera et bonne chance!

const contentToRightClick=document.querySelector("div#contentToRightClick");

//const contentToRightClick=window; //If you want to add it into the whole document

contentToRightClick.oncontextmenu=function(e){
  e=(e||window.event);
  e.preventDefault();
  console.log(e);
  
  return false; //Remove it if you want to keep the default contextmenu 
}

div#contentToRightClick{
  background-color: #eee;
  border: 1px solid rgba(0,0,0,.2);
  overflow: hidden;
  padding: 20px;
  height: 150px;
}

<div id="contentToRightClick">Right click on the box !</div>

Si vous souhaitez appeler la fonction alors que l'événement de clic droit signifie que nous pouvons utiliser

 <html lang="en" oncontextmenu="func(); return false;">
 </html>

<script>
function func(){
alert("Yes");
}
</script>

Cela a fonctionné avec moi

if (evt.xa.which == 3) 
{
    alert("Right mouse clicked");
}

Essayez d'utiliser la propriété whichet / oubutton

La démo

function onClick(e) {
  if (e.which === 1 || e.button === 0) {
    console.log('Left mouse button at ' + e.clientX + 'x' + e.clientY);
  }
  if (e.which === 2 || e.button === 1) {
    console.log('Middle mouse button ' + e.clientX + 'x' + e.clientY);
  }
  if (e.which === 3 || e.button === 2) {
    console.log('Right mouse button ' + e.clientX + 'x' + e.clientY);
  }
  if (e.which === 4 || e.button === 3) {
    console.log('Backward mouse button ' + e.clientX + 'x' + e.clientY);
  }
  if (e.which === 5 || e.button === 4) {
    console.log('Forward mouse button ' + e.clientX + 'x' + e.clientY);
  }
}
window.addEventListener("mousedown", onClick);

Quelques infos ici

Gérer l'événement à l'aide de la jQuerybibliothèque

$(window).on("contextmenu", function(e)
{
   alert("Right click");
})

Pour gérer le clic droit de la souris, vous pouvez utiliser l'événement 'oncontextmenu'. Voici un exemple:

 document.body.oncontextmenu=function(event) {
     alert(" Right click! ");
 };

le code ci-dessus alerte du texte lorsque le clic droit est enfoncé. Si vous ne souhaitez pas que le menu par défaut du navigateur apparaisse, vous pouvez ajouter return false; À la fin du contenu de la fonction. Merci.

Oui, c'est un événement javascript mousedown. Il existe également un plugin jQuery pour le faire