Javascript 传单标记事件在错误的时间触发

Javascript 传单标记事件在错误的时间触发,javascript,leaflet,Javascript,Leaflet,我正在使用宣传册(V0.7.7),我有一个Ajax调用,它以可单击文本标签的形式将一些服务器数据绑定到我的地图。在绑定从服务器获取的JSON数据的循环中,我有以下代码: var item_name = L.marker([data.X, data.Y], { icon: L.divIcon( { className:'MapTag', iconAnchor: [10, 10], html:'<img src="/Images

我正在使用宣传册(V0.7.7),我有一个Ajax调用,它以可单击文本标签的形式将一些服务器数据绑定到我的地图。在绑定从服务器获取的JSON数据的循环中,我有以下代码:

var item_name = L.marker([data.X, data.Y],
{
    icon: L.divIcon(
    {
        className:'MapTag', 
        iconAnchor: [10, 10],
        html:'<img src="/Images/Map/Item' + data.Id + '.png">' + data.Name 
    })
}).on('click', onItemClick(data.Id));

item_layer.addLayer(item_name);
现在,好消息是,如果我注释掉其中的事件绑定部分,循环就完成了,传单的行为也应该如此。然而,当我绑定click事件时,事情变得很奇怪。对于我绑定到的集合中的每个项,都会触发一次事件。当从服务器加载数据时,每次循环中都会弹出一个带有当前项Id的警报。感觉它是“onload”而不是“onclick”触发的。最重要的是,它也不会在加载后注册对divicon的点击

这里一定有什么东西我遗漏了,但我看不出是什么。有什么建议吗

这个问题类似于()

分辨率: 我将divIcon声明的最后一行更改为:

}).on('click', function(e){ alert(data.Id); });
现在,它可以按预期工作。我猜奇怪的绑定行为是由于没有绑定已定义的方法引用和传单的事件管理代码中存在某种功能崩溃


我保留了“e”的论点,因为这是传单文件所显示的。我没有使用它,但是如果其他人复制粘贴了它,他们可能需要它。

您混淆了函数引用和函数调用的概念,并且没有对项目ID进行修改

如果您声明:

function onItemClick(id) { alert(id); }
这将打印对函数的引用:

console.log( onItemClick );
这将打印调用该函数的返回值(因为它不返回任何内容,这等于
未定义的
):

所以当你这样做的时候:

L.marker(....).on('click', onItemClick(id) );
调用该函数,并且
on()
接收该函数的返回值,即:

L.marker(....).on('click', undefined );
您要做的是使用一个返回函数的函数:

console.log( onItemClick );
这样,当你这样做的时候

L.marker(....).on('click', onItemClick(5) );
这将进行函数调用,并使用返回值,该值现在如下所示:

L.marker(....).on('click', function() { alert(5); } );

您混淆了函数引用和函数调用的概念,并且没有对项ID进行修改

如果您声明:

function onItemClick(id) { alert(id); }
这将打印对函数的引用:

console.log( onItemClick );
这将打印调用该函数的返回值(因为它不返回任何内容,这等于
未定义的
):

所以当你这样做的时候:

L.marker(....).on('click', onItemClick(id) );
调用该函数,并且
on()
接收该函数的返回值,即:

L.marker(....).on('click', undefined );
您要做的是使用一个返回函数的函数:

console.log( onItemClick );
这样,当你这样做的时候

L.marker(....).on('click', onItemClick(5) );
这将进行函数调用,并使用返回值,该值现在如下所示:

L.marker(....).on('click', function() { alert(5); } );

哇,真是疯了。我看了几个小时,你过来把它钉上。谢谢你的帮助。我刚注意到一些事情。因为我们映射到click事件的函数是一个闭包,所以当我将此代码放入一个循环中时,所有项都映射到同一个Id。(所有项都查看Id,循环终止后的Id是最后一个Id)我试图将函数调用作为字符串写入标记,这样每个传单标记就不会包含对相同值的引用。我需要重新思考这个问题。不,闭包的目的是通过定义自己的变量范围来防止这种情况。我建议你仔细阅读关于闭包的文档——我知道它们很难掌握。哇,真让人吃惊。我看了几个小时,你过来把它钉上。谢谢你的帮助。我刚注意到一些事情。因为我们映射到click事件的函数是一个闭包,所以当我将此代码放入一个循环中时,所有项都映射到同一个Id。(所有项都查看Id,循环终止后的Id是最后一个Id)我试图将函数调用作为字符串写入标记,这样每个传单标记就不会包含对相同值的引用。我需要重新思考这个问题。不,闭包的目的是通过定义自己的变量范围来防止这种情况。我建议您阅读有关闭包的文档-我知道它们很难掌握。