Leaflet中点击事件无法触发问题求助

嘿，我看了你的代码，发现两个关键问题导致click事件没法和mouseover正常协同工作：

1. Click事件函数缺少参数传递 #

你在click事件的处理函数里引用了e，但函数定义里没把它传进去！这样e会是undefined，后面的map.fire("click", e)直接就会报错，导致整个click事件逻辑卡壳。

2. 不必要的map.click事件触发 #

在marker的click事件里手动触发map.fire("click", e)很容易引发事件冲突——Leaflet本身有事件冒泡机制，marker的click事件本来就会冒泡到map层，你手动再触发一次反而会干扰原有逻辑，甚至让你的alert都弹不出来。

修正后的完整代码 #

事件绑定部分

layer.on({
  mouseover: function (e) {
    L.popup()
      .setLatLng(e.latlng)
      .setContent("Test")
      .openOn(map);
  },
  click: function (e) { // 这里补上e参数
    alert("Click");
    // 如果你确实需要触发map的click事件，确保传递正确的事件对象
    // map.fire("click", e); 
    // 建议除非有明确业务需求，否则删掉这一行
  }
});

自定义Marker部分（优化得更简洁）

option.pointToLayer = function (feature, latlng) {
  var icon = L.icon({
    iconUrl: 'Image/InvestmentIcons/environmentalflow.png',
    iconSize: [12, 12]
  });
  // 创建marker时直接传入icon选项，不用单独修改options
  return L.marker(latlng, { icon: icon });
}

补充说明 #

如果你的需求确实需要在点击marker时同时触发map的click事件，那保留map.fire("click", e)是可以的，但一定要确保e参数被正确传递到click函数里。另外，也可以用e.stopPropagation()来阻止事件冒泡，避免map的click事件被自动触发，不过这取决于你的具体业务场景。

内容的提问来源于stack exchange，提问作者Aditya Agarwal