当图层控件移出贴图元素时,不会发出传单贴图单击事件

Leaflet-map click event not emitted when layer controls moved out of map-element

本文关键字:单贴图 事件 单击 移出 控件 图层 图元 元素      更新时间:2023-09-26

我对传单地图的点击事件有问题。

我把图层控制从地图元素中移出,如下所示:

document.getElementById('outside-controls').appendChild(ctrl.getContainer());

在那之后,每当我更改图层控制设置时,我就开始错过点击事件。

这是工作示例代码:

var dom_documentClicks = document.getElementById('document-clicks'),
    dom_mapClicks = document.getElementById('map-clicks'),
    count_documentClicks = 0,
    count_mapClicks = 0;
var osmUrl = 'http://{s}.tile.osm.org/{z}/{x}/{y}.png',
    osmAttrib = '&copy; <a href="http://openstreetmap.org/copyright">OpenStreetMap</a> contributors',
    osm = L.tileLayer(osmUrl, {
      maxZoom: 18,
      attribution: osmAttrib
    }),
    poly = L.polygon([]),
    ctrl = L.control.layers({}, {'Polygon Layer': poly}, {collapsed: false});
// initialize the map on the "map" div with a given center and zoom
var map = L.map('map', {layers: [osm, poly]}).setView([61.497752, 23.760954], 12);
ctrl.addTo(map);
// This seems to be the reason why click-event is not emitted.
document.getElementById('outside-controls').appendChild(ctrl.getContainer());

function onDocumentClick(e) {
  count_documentClicks++;
  dom_documentClicks.innerHTML = count_documentClicks;
}
function onMapClick(e) {
  count_mapClicks++;
  dom_mapClicks.innerHTML = count_mapClicks;
}
map.on('click', onMapClick);
document.addEventListener('click', onDocumentClick);

并链接到jsFiddle:http://jsfiddle.net/LnzN2/135/

有谁知道如何解决这个问题(bug?)

看起来ctrl.getContainer()返回的div会消耗映射中的下一个点击事件。

更改此项时:

ctrl.getContainer()

到此:

ctrl.getContainer().childNodes[0]

它有效!