Javascript Girl
  1. Javascript Girl
  3. Détecter le bouton gauche de la souris appuyer sur
Intereting Posts
For-in vs Object.key pour tout, sans propriétés héritées Lecture en csv avec analyse de date Oracle Apex 5 Ouverture de la page dans une nouvelle fenêtre Node.js / Sequelize.js / Express.js – Comment insérer dans plusieurs-à-nombreux association? (Synchronisation / async?) Toile HTML (SVG) – Dessiner l'image sur la surface du cylindre Récupération de la valeur du champ de texte à l'aide de javascript Comment faire la mise au point par défaut dans la page de contenu de la page principale Pourquoi ne puis-je pas capturer de manière fiable un événement mouseout? MongoDB dot (.) Dans le nom de la clé Impossible d'obtenir le tampon de signature HTML html5 à soumettre à la base de données La chaîne Javascript remplace avec regex pour supprimer les caractères illégaux RequireJS – script ASP.NET MVC Bundle Un moyen approprié d'envoyer un jeton d'authenticité avec AJAX ..? Masquage / chevauchement d'image en toile Comment changer la page actuelle de Phantomjs à l'aide de boutons?

Détecter le bouton gauche de la souris appuyer sur

Je déteste ce désordre avec les boutons de la souris créés par W3C et MS! Je veux savoir si le bouton gauche de la souris est pressé lorsque je reçois un événement mousedown.

J'utilise ce code 

// Return true if evt carries left mouse button press function detectLeftButton(evt) { // W3C if (window.event == null) { return (evt.button == 0) } // IE else { return (evt.button == 1); } }

Cependant, cela ne fonctionne pas dans Opera et Chrome, car il arrive que window.event existe là aussi.

Alors qu'est-ce que je fais? J'ai une détection de navigateur, mais nous savons tous que l'on ne peut pas compter sur le masquage de certains navigateurs récemment. Comment puis-je détecter le bouton gauche de la souris CONFIABLY?

Réponse mise à jour. Ce qui suit détecte si le bouton gauche et gauche de la souris est enfoncé: 

 function detectLeftButton(evt) { evt = evt || window.event; if ("buttons" in evt) { return evt.buttons == 1; } var button = evt.which || evt.button; return button == 1; }

Pour plus d'informations sur la gestion des événements de souris en JavaScript, essayez http://unixpapa.com/js/mouse.html

Il existe maintenant une propriété standard event.buttons W3C event.buttons charge par IE9 en mode standard , et Gecko 15+ .

Le W3C a complètement complété la propriété event.button, donc pour un événement de navigateur compatible avec les normes. Le bouton est 0, mais pour les navigateurs créés avant le standard, event.button est 1.

Ainsi, le code doit éviter d'utiliser le event.button sauf pour les navigateurs plus anciens. Le code suivant devrait fonctionner: 

 function detectLeftButton(event) { if ('buttons' in event) { return event.buttons === 1; } else if ('which' in event) { return event.which === 1; } else { return event.button === 1; } }

Vous pouvez utiliser le code suivant: 

 onmouseup="if(window.event.which==1){//code for left click} else if(window.event.which==3){//code for right click}"

Même si event.buttons fonctionne maintenant sur Chrome, Safari ne le supporte toujours pas. Une solution de contournement consiste à utiliser les événements onmousedown et onmouseup au niveau du document ou du parent comme: onmousedown = "bMouseDown = true" onmouseup = "bMouseDown = false" 

 // 0 left, 2 right, 1 middle, other.. extra buttons, gaming mouses var buttonsArray = [false, false, false, false, false, false, false, false, false]; var mousePressed = false; document.onmousedown = function(e) { buttonsArray[e.button] = true; mousePressed = true; }; document.onmouseup = function(e) { buttonsArray[e.button] = false; mousePressed = false; }; document.oncontextmenu = function() { return false; }

Explication: Lorsque la souris est en panne, nous changeons pour vrai le bouton pressé dans notre tableau de boutons. Lorsque la souris est en marche, nous changeons pour false le bouton pressé sur false.

Maintenant, nous pouvons établir le bouton qui est pressé plus précisément, mais nous avons un problème de clic droit. Parce que avec ce bouton, nous ouvrons un menu contextuel sur le navigateur, et cela échappe à notre contrôle … alors, nous désactivons le menu contextuel pour Détectez correctement le clic droit. Si nous ne le faisons pas, nous devons résoudre le clic gauche aussi … et c'est une complication qui échappe à cette réponse.

Afin de simplifier les choses, nous pouvons ajouter une autre variable mousePressed et un indicateur si la souris est en panne ou en haut.

Fonctionne parfaitement sur chrome, je ne l'ai pas testé dans un autre navigateur, mais je suppose que c'est ok dans firefox et opéra aussi … IE ??? Je m'en fous IE.

Profitez-en!