当我单击包含按钮的l.divicon自定义html时如何停止弹出窗口的打开

时间:2019-07-05 14:33:42

标签: javascript jquery leaflet esri-leaflet esri-oss

我正在使用esrileaflet库在具有图标l.divicon的地图上呈现标记,该图标在自定义HTML中具有一个按钮。

我将一个事件绑定到了被单击的按钮单击上,但是我又不想打开标记弹出窗口。

由于l.divicon在其自定义HTML和标记的一部分中都包含一个按钮,因此每次我单击该按钮时,它都会显示警报,并打开标记弹出窗口。如何停止标记弹出窗口?

let markerIcon = L.divIcon({
  iconSize: L.point(32, 32),
  iconAnchor: [5, 5],
  html: '<div><img src= "url here"><button id="MyBtn"></button></div>'
});
marker.setIcon(markerIcon);

$("#MyBtn").on('click', function(e) {
  alert("Hi there");
});

1 个答案:

答案 0 :(得分:2)

当click事件到达标记时,似乎会出现弹出窗口。在这种情况下,请在e.stopPropagation()处理程序内添加click,以阻止事件从#MyBtn冒泡到标记。

$("#MyBtn").on('click', function(e) {
  e.stopPropagation();
  alert("Hi there");
});