javascript - Leaflet 在从 GeoJSON 层单击标记时打开一个弹出窗口

Question

我制作了一张传单 map 。使用 GeoJSON 加载数据在 onEachFeature 事件中，我将弹出窗口与从该功能的某些属性中获取的动态内容文本绑定(bind)。

问题是我编写的代码弹出窗口只在第一次点击时显示，然后我再次点击同一个标记，它不会显示。

代码如下:

function showMarkets() {
    $.ajax({
        url: '/API/GetMarketsWithStatus',
        dataType: 'json',
        async: true,
    }).done(function (geoData) {
        mapLayers.markets = L.geoJSON(geoData, {
            onEachFeature: onEachMarketFeature
        }).addTo(map);
    });
}
function onEachMarketFeature(feature, layer) {
    layer.on('click', function (e) {
        layer.bindPopup('<a href="http://some-url-to-call?mktid=' + feature.properties.code + '">' + feature.properties.name + '</a>');
        this.openPopup();
    });
}

Answer 1

在创建功能时绑定(bind)你的弹出窗口，而不是当用户点击它时，Leaflet 将为你处理点击事件:

function onEachMarketFeature(feature, layer) {
    layer.bindPopup('<a href="http://some-url-to-call?mktid=' + feature.properties.code + '">' + feature.properties.name + '</a>');
}