Désactiver le bouton central de la souris pour le dialog modal

J’ai un tel problème: j’ai un lien qui sur clic ouvre ajaxFormDialog dans la boîte de dialog modale au-dessus de la page en cours. Mais lorsque je clique sur le bouton du milieu, celui-ci s’ouvre dans un nouvel onglet et tout ne se trouve pas dans la fenêtre modale, mais actuellement dans une nouvelle page à onglet et son apparence est mauvaise. Donc, ma question serait, comment il est possible de désactiver le clic du bouton central de la souris pour le lien actuel?

  $(function (){ $('a.ajaxFormDialog').live("click", function(e) { $.ajax({ type: "POST", url: $("#formContent form").attr("action"), data: $("#formContent form").serialize(), success: function(data) { //... do something } }); });

UPD j’ai utilisé votre suggéré

 if(e.which == 2) { e.preventDefault(); }

il empêche peut-être par défaut, mais ouvre toujours un nouvel onglet avec ce formulaire. Lorsque je clique avec le bouton du milieu / molette de la souris sur le lien, il ne me montre même pas qu’il a saisi cette $ (function () {$ (‘a.ajaxFormDialog’). On (“click”, function (e) {.. .

UPD2 j’ai écrit un tel code:

 $(function (){ $('a.ajaxFormDialog').live("click", function(e) { console.log("Which button is clicked: " + e.which); if(e.which == 2) { e.preventDefault(); } // rest of the code...

Ainsi, lorsque je clique sur le bouton gauche de la souris, la console me montre “Le bouton sur lequel on clique: 1”, mais lorsque je clique sur le bouton milieu / molette de la souris, il ne me montre rien et rest ouvert dans un nouvel onglet.

Étant donné que Firefox (et probablement Opera également) a retiré le comportement du clic central aux mains des développeurs, je suggérerais de remplacer le ou les nœuds d’ancrage par un autre, par exemple .

Cela semble sémantiquement correct, car la balise ne fonctionne plus comme un lien réel dans votre scénario d’utilisation. Il peut maintenir son apparence en utilisant CSS.

Un exemple en direct peut être trouvé dans ce jsfiddle .

Pour ce type de balisage:

 replaced link

vous pouvez utiliser CSS tel que:

 a, .ajaxFormDialog { color: orange; text-decoration: underline; cursor: hand; } a:hover, .ajaxFormDialog:hover { background: orange; color: white; }

et remplacez l’ancre par une span , y compris la possibilité de stocker toute propriété souhaitée et de conserver tous les nœuds enfants (le cas échéant). Vous pouvez récupérer ces propriétés ultérieurement dans le gestionnaire d’événements.

L’exemple de code est le suivant:

 var genericHandler = function(e) { var el = $(e.target); var href = el.data('href'); //extract data console.log('clicked span: ',el, ' with stored href: ', href); //do stuff here }; $('a.ajaxFormDialog').replaceWith(function(){ var el = $(this); console.log('replacing element: ', el); return $("").addClass('ajaxFormDialog').append($(this).contents()). data('href', el.attr('href')). //you can store other data as well click(genericHandler); });

Cela semble être le moindre de tous les maux, si vous souhaitez éviter les effets secondaires du clic du milieu, pour le moment.

 $("a.ajaxFormDialog").on('click', function(e) { if( e.which == 2 ) { e.preventDefault(); } });

MISE À JOUR :

La fonction par défaut du bouton central de la souris ne peut pas être désactivée dans Firefox. Comme indiqué ici .

Firefox et les autres navigateurs Gecko ont libéré le contrôle du bouton droit de la souris, mais l’action par défaut d’un clic du milieu ne peut pas être désactivée. Vous pouvez modifier l’action par défaut en modifiant les parameters de la souris dans l’URL “about: config”, mais Javascript ne peut pas les annuler.

Vous pouvez trouver le lien similaire de votre message ici .

La solution de travail très proche dans certains navigateurs modernes (comme Chrome) est la suivante:

 if (event.preventDefault) event.preventDefault(); else event.returnValue= false; return false;