Comment puis-je arrêter la propagation des événements avec un clic droit sur le marqueur Leaflet?


9

Je n'ai pas trouvé d'événement clic droit dans les marqueurs Leaflet, j'ai donc commencé à écouter l'événement mousedown. Dans la méthode qui résout cet événement, je vérifie

if (event.originalEvent.button == 2) {
    do_something();
    // now i want to stop propagation of the rightclick
    return;
}

Cela fonctionne dans la mesure où do_something () est appelé, mais l'événement se propage à la carte et un menu contextuel est affiché. Comment empêcher l'événement de se propager sur la carte?

Est-ce que cela fonctionne dans tous les principaux navigateurs (ie IE)?

Réponses:


4

Ma première réponse ne fonctionnait apparemment pas et comme je suis maintenant confronté au même problème. Voici une nouvelle approche:

Dépliant prend en charge un événement appelé contextmenu. Comme indiqué dans la documentation de l'événement Leaflet ici .

Déclenché lorsque l'utilisateur appuie sur le bouton droit de la souris sur la carte, empêche le menu contextuel du navigateur par défaut de montrer s'il y a des écouteurs sur cet événement.

Donc, théoriquement, le code

marker.on('contextmenu', function(e) {
  this.openPopup();
});

devrait fonctionner très bien. Mais apparemment, l'implémentation est en retard sur la documentation. Pour l'instant (dépliant 0.4.5), l' contextmenuévénement n'est apparemment pas encore pris en charge sur les marqueurs, bien qu'il fonctionne parfaitement sur les objets polylignes.

Il semble y avoir du travail en cours pour activer cette fonctionnalité dans un proche avenir (voir les discussions ici et ici ). Donc, je suppose que nous pouvons simplement espérer que Leaflet fonctionne rapidement et active l'événement dans la prochaine version ...

Edit: Ignorez ce que j'ai dit à propos de l'attente de la mise en œuvre. Si vous téléchargez la dernière branche principale de développement et que vous créez vous-même la brochure, vous bénéficiez d'une prise en charge complète des contextmenuévénements sur les marqueurs. Codage heureux.


4

Empêcher le comportement par défaut dans IE et tous les autres navigateurs:

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

Cela ne semble pas fonctionner. L'avez-vous testé dans Leaflet? Et votre événement est-il un événement dépliant ou le DOMMouseEvent original déclenché par le navigateur?
mrg

C'est pour un événement DOM. Si Leaflet encapsule les événements, utilisez event.originalEvent.
tmcw

4

Essayez cette fonction interne:

L.DomEvent.stopPropagation(event);

Cela devrait faire l'affaire.

PS Je n'ai jamais trouvé cela dans aucune documentation mais je l'ai vu utilisé dans un patch. À utiliser à vos risques et périls. ;)

Edit: j'ai aussi trouvé cette fonction interne

L.DomEvent.preventDefault(event);

Ce qui semble être très similaire event.preventDefault()à celui de jQuery.


J'ai utilisé votre extrait de code, mais ce qui se passe est le même qu'avec la solution de tmcw. Je clique avec le bouton droit sur mon marqueur. Cela va à la méthode d'écoute. Là, il supprime le marqueur (c'est ce que le clic droit devrait faire pour moi), puis un menu contextuel s'ouvre sur la carte où j'ai cliqué comme si tout le marqueur n'était pas arrivé.
mrg

Par hasard, je viens de trouver ça L.DomEvent.preventDefault(event);. D'après ce que j'ai vu (en regardant la source Leaflet.js), cela devrait être très similaire à celui preventDefault()fourni par jQuery ... Essayez-le! :)
fgysin réintègre Monica

Je l'ai essayé, mais le menu contextuel standard que j'obtiens dans FF lorsque je clique avec le bouton droit sur une page html continue d'apparaître.
mrg

2

J'ai d'ailleurs eu une solution pour arrêter l'événement.

Par exemple, si un événement est créé comme ceci - map.on("click", onMapClick);, l'événement peut être arrêté avec ce code -map.off("click", onMapClick);

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.