Cliquez avec le bouton droit de la souris sur l'événement de déclenchement des déclencheurs Firefox

Question

J'ai remarqué que le clic droit de la souris sur Firefox déclenche un addEventListener.

J'ai essayé ce code sur plus de navigateurs et plus d'OS (IE 11-10-9, Safari, Chrome) et en appuyant sur le bouton droit de la souris, seulement sur Firefox le message console.log est toujours imprimé.

<div id="one-div" style="height:400px;width:500px;background-color:#000;"> click me </div> 
<script> 
    function cb(event, from){ 
     // if click is fired on <div> with: 
     // left click, both EventListener will be printed. 
     // right click, only the 'document' one will be printed. 
     event.preventDefault(); 
     console.log(event + ' from: ' + from); 
    } 
    document.addEventListener('click', function(e){ 
     cb(e,'document'); 
    }, false); 
    document.getElementById("one-div").addEventListener('click', function(e){ 
     cb(e,'one-div'); 
    }, false); 
</script> 

Et j'ai remarqué que, lorsque le clic est tiré dans la div, il ne se déclenche que l'document.addEventListener. J'ai cherché sur Firefox changelog mais aucune nouvelle à ce sujet.

Quelqu'un peut-il expliquer ce comportement? Merci!

Answer 1

Par défaut, dans tous les navigateurs, l'événement de clic droit est capturé par addEventListener('contextmenu'), sinon un clic droit ouvrira une fenêtre avec quelques options (chaque navigateur en a un différent).

Dans Firefox, lorsque vous ajoutez addEventListener('click') à l'objet document, il va capturer tous les événements de souris en cliquant (gauche, droite, roue) sur le document et il désactivera this clic droit comportement.

De plus, c'est ce que Mozilla documentation dit dans la section Événements de la souris, bien que le (TOUT bouton) choses n'est pas activé jusqu'à ce que vous ajoutez l'auditeur à l'objet document

clic: Un pointage Le bouton de l'appareil (bouton ANY, qui sera bientôt le bouton principal uniquement) a été enfoncé et relâché sur un élément.

* Note: encore la fenêtre ci-dessus apparaît lorsque vous double cliquez sur le bouton droit de la souris, mais pas avec un seul clic.