javascript - 传单插件中的单击事件 - 如何使单击事件仅在地图图块图像内起作用？

Question

我有 256*256 的图像。我已经在传单中设置了图像，如下所述。

var cloudmadeUrl = tileserver + '/' + selected_map + '/tiles_{z}_{y}x{x}.png';

cloudmade = new L.TileLayer(cloudmadeUrl, {maxZoom: 4, noWrap: true, continuousWorld: true });

map = new L.Map('map', {
          center : latlng, 
          zoom : 0, 
          layers : [cloudmade], 
          tms: true
       });

我有地图的点击事件。现在，如果我在平铺图像外部单击，则单击事件将起作用。

如何使单击事件仅在地图图块图像内起作用？

Answer 1

不必担心地图边界（因为它与容器而不是 tilelayer 相关联），您可以担心单击事件目标。请参阅将event.target 与现有 jquery 对象匹配以获取建议。

这是一个有效的 JSFiddle。它event.originalEvent在 Leaflet 代码中用于收集有关原始点击事件的信息。然后它根据点击事件的类做一些事情。