[英]Stop propagation of 'click' event in Leaflet
在我们的一个项目中,我们使用Leaflet
和Leaflet.markercluster
插件。 查看Leaflet
的来源,我发现它将_collapse()
函数附加到地图的click
事件,因此每当我点击地图时,它都会收缩先前扩展的集群。
现在,我想禁用此行为。 如果集群被扩展,那么我只想在click
事件时取消选择它的所有标记(并且不要收缩集群本身)。 这是我的一段代码:
map.on('click', function(e) {
scope.deselectAllMarkers();
});
我试图在这个单行回调的末尾添加以下几行,以停止click
事件的传播:
scope.L.DomEvent.stopPropagation(e);
scope.L.DomEvent.preventDefault(e);
scope.L.DomEvent.stop(e);
scope.L.DomEvent.stopPropagation(e.originalEvent);
scope.L.DomEvent.preventDefault(e.originalEvent);
scope.L.DomEvent.stop(e.originalEvent);
它们都不起作用。 每当我单击地图时,隐藏在Leaflet
源中的默认侦听器都会保持其调用。 我错过了什么吗?
我知道这个答案已经很晚了,但是如果有人对解决方案感兴趣,这就是我解决的方法。
下面的这个片段是一个将函数绑定到click
事件的例子。
map.on('click', doSomething);
实际上,在检查了传单的 API和一些极客调试之后,似乎事件返回了一个对象,而不是事件本身。 事件本身被包装到返回对象中的一个字段中。
var doSomething = function(map) {
// stop propagation
map.originalEvent.preventDefault();
};
使用上面的代码片段时,事件冒泡已经停止,这是我想要的,也可能是您想要的。
这个对我有用...
var div = L.DomUtil.get('div_id');
if (!L.Browser.touch) {
L.DomEvent.disableClickPropagation(div);
L.DomEvent.on(div, 'mousewheel', L.DomEvent.stopPropagation);
} else {
L.DomEvent.on(div, 'click', L.DomEvent.stopPropagation);
}
我知道这个答案很晚才出现,但就像在 jquery 中一样,您可以使用.off
map.on('click', doSomething);
map.off('click');
它适用于任何传单事件。
我将它用于仅触发一次的'zoomend'
事件。
map.on('moveend', function(e){
console.log("any code");
map.off('moveend');
});
最后,据我所知,我通过手动删除调用_collapse()
方法的默认click
处理程序解决了这个问题。 脏,但它做到了。
您不能从事件处理程序覆盖事件传播。 页面加载后,您需要使用内置的 Leaflet 助手,如下所示:
$('.element').each (i,el)->
L.DomEvent.disableClickPropagation(el);
你有这样的使用event.stopPropagation()
map.on('click', function(e) { //don't forget to pass this 'e' event parameter
e.preventDefault();
scope.deselectAllMarkers();
e.stopPropagation();
return false;
});
试试这个
1. event.stopPropagation()
2. event.preventDefault()
3. return false
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.