如何仅在传单地图上禁用点击事件？

Question

我创建了 button 以在我的传单 map id 中打开 bootstrap 模式，如下所示，

<div id='map'> 
  <div id="bootstrapModalBtn" data-toggle="modal" data-target="#baseLayerModal">Click</div>
</div>

当我点击地图时，我添加了添加标记并打开弹出窗口的功能，如下所示，

map.on('click', function(e) {
    const latLng = [e.latlng.lat, e.latlng.lng];
    marker = L.marker([e.latlng.lat, e.latlng.lng]).addTo(map);
    marker.bindPopup("this is popup").openPopup();
}

但是当我点击我的 button 时，它会同时打开 bootstrap 模式和传单弹出窗口。但我只想在用户单击 button 时打开 bootstrap 模式。为了阻止这个问题，我尝试了以下方法，

$(".bootstrapModalBtn").on("click", L.DomEvent.stopPropagation);

添加最后一部分后，我无法获得 bootstrap 模式和传单弹出窗口。我的问题是，如何仅从地图中禁用 button?

的点击事件

PS: 我也试过map.off('click')的方法。但是我在设置map.off('click'),

后无法重新激活点击事件

$(".bootstrapModalBtn").on("click", map.off('click');

Answer 1

好吧，这似乎只是一个错字，您的 bootstrapModalBtn 元素未被选中。

将 . 替换为 jQuery 选择器中的 #（id 选择器，而不是 class )。或将 id="bootstrapModalBtn" 替换为 class="bootstrapModalBtn".

然后，如你所说，使用event.stopPropagation()。

$("#bootstrapModalBtn").on("click", (e) => {
    e.stopPropagation();

    /* open your modal here */
});

如何仅在传单地图上禁用点击事件？

How to disable click event on leaflet map only?

javascript

jquery

leaflet