javascript - 传单标记均具有相同的值

Question

我正在使用 Mapbox 和 Javascript 制作 Leaflet。我知道我的问题的根源是循环内的 javascript 闭包。我查看了所有其他示例，但似乎找不到与我的示例类似的示例。

我有一个 for 循环遍历我添加的点，但它们最终都是相同的值。

这是添加传单标记以及附加属性的功能

marker.bindPopup(<button class = "trigger" onclick = buttonClick(geojsonFeature) </button> )

这是 onclick 函数，调用时应该显示当时发生的计数，但它显示循环中的最后一个计数

function buttonClick(object){
    alert(object.properties.Count)
}

我尝试过类似的方法:

for (var i = 1; i <= 5; i++) {
    function clickHandler(num) {
        $("#div" + i).click(
            function() {
                alert(num)
            }
        )
    }
    clickHandler(i);

但是没有效果。任何帮助将不胜感激!

Answer 1

当点击按钮时，geojsonFeature 并不是你想象的那样......

因此，您必须将其存储在某处，并提供一种在单击按钮时检索它的方法。

类似...

//your creation loop
jsonString = JSON.stringify(geojsonFeature); 

marker.bindPopup(<button class = "trigger" data-json = jsonString onclick = buttonClick(this) </button> )
// Note the this operator that will give context when the button is clicked
// end of your creation loop

function buttonClick(object){
    // retrieve button attribute called data-json and make it an object
    feature = JSON.parse(object.getAttribute("data-json"));
    alert(feature.properties.Count)
}