Désactivation du défilement du clic du milieu avec javascript

Contexte : Je crée une table qui rappelle whenisgood.net , en ce sens qu'elle a fait un clic-et-glisser pour créer des éléments de table. Je veux appeler différents types de code de basculement lorsque les boutons de la souris gauche, centrale et droite activent un événement mousedown.

En utilisant JQuery, je vais bien commencer.

$(".togglable").bind("contextmenu", function() {return false;}); $(".togglable").bind("mousedown", function(e){ e.preventDefault(); toggle(this, e); }); 

Dans la fonction toggle() , je peux utiliser e.which pour déterminer quel bouton a été cliqué.

The punchline : J'ai utilisé e.preventDefault () en espérant qu'il arrêterait le clic central sur le comportement par défaut du défilement. Ce n'était pas le cas. Que puis-je faire pour empêcher l'action de défilement de l'activation?

Voir aussi "Déclencher l'événement onclick en utilisant le clic du milieu"

Le clic central peut être désactivé avec Javascript , mais uniquement dans IE, WebKit et Konquerer. Firefox nécessite une édition de fichier de configuration . C'est 2017 et firefox 50 prend en charge cela.

C'est une vieille question … mais si je comprends bien, vous souhaitez désactiver le défilement via le bouton central de la souris.

De nos jours, vous pouvez le faire avec une seule ligne de vanilla JS:

 document.body.onmousedown = function(e) { if (e.button === 1) return false; } 

Actuellement, ma solution est la suivante: (plus jquery!)

 $(".togglable").wrap( "<a href='javascript:void(0);' onclick='return false;'></a>" ); 

En l'enveloppant dans un lien (via jquery wrap ), les navigateurs pensent que c'est un lien et ne se défile pas sur le clic du milieu, même si vous faites glisser votre souris. Avec cette configuration, et ma situation, il y a quelques cas (mineurs).

Firefox ouvrira un nouvel onglet lorsque vous cliquez sur le milieu, mais seulement si vous ne faites pas glisser. Opera ouvrira un nouvel onglet lorsque vous cliquez sur le milieu, faites glisser ou non. C'est pourquoi j'ai utilisé href='javascript:void(0);' Au lieu de juste href='#' sorte que le navigateur du client ne chargerait pas une page entière, juste une page vierge avec une URL étrange.

Mais cette solution fonctionne comme un charme sur Chrome et Safari. Ça fonctionne bien avec IE8, sauf que maintenant, lorsque je clique gauche, je change le pointeur vers un symbole «ne peut pas le faire», car il pense que je veux faire glisser le lien quelque part. Non testé sur les anciennes versions d'IE.

Il est déjà un peu vieux, mais j'ai essayé de contourner ceci dans Firefox (j'utilise encore 3.6) et je partagerai mes résultats, peut-être que quelqu'un le trouvera utile.

Vérifiez que si vous créez un fichier HTML vide (ou un petit document avec quelques paragraphes) et chargez-le dans Firefox, la barre de défilement du milieu ne s'affiche pas. C'est parce que la largeur et la hauteur de <body> sont inférieures à la taille de la fenêtre. Si vous mettez beaucoup d' <br> , ce n'est pas le cas et la barre de défilement apparaît sur le clic du milieu.

Google a réussi à empêcher le scroller du clic du milieu d'apparaître dans Google Maps dans Firefox en s'assurant (via JS) que la taille <body> est toujours inférieure à la taille de la fenêtre, plus en ajoutant <body style="overflow:hidden;"> .

Ceci n'est guère réalisable en général, mais peut parfois être utile.