JavaScript 即使使用匿名函数或绑定,在注册 OpenLayers 事件时闭包也会在循环内触发所有事件
JavaScript closure triggers all inside the loop when registering OpenLayers event even with anonymous function or bind
我有以下代码,我试图在其中添加一些标记到 OpenStreetMaps 和 onClick 它们会触发自己的弹出窗口。 lonLats 是一个数组,包含具有经度、纬度和文本属性的对象。代码大致如下
<div id="mapdiv"></div>
<script src="http://www.openlayers.org/api/OpenLayers.js"></script>
<script>
var map = new OpenLayers.Map("mapdiv");
map.addLayer(new OpenLayers.Layer.OSM());
var projection = new OpenLayers.Projection("EPSG:4326"); // transform from WGS 1984
var mapProjection = map.getProjectionObject(); // // to Spherical Mercator Projection
var zoom=16;
var markers = new OpenLayers.Layer.Markers( "Markers" );
map.addLayer(markers);
map.setCenter (new OpenLayers.LonLat(lonLats[0].lon, lonLats[1].lat).transform(projection, mapProjection), zoom);
lonLats.forEach(function(el){
var lonLat = new OpenLayers.LonLat(el.lon, el.lat).transform(projection, mapProjection);
var marker = new OpenLayers.Marker(lonLat);
markers.addMarker(marker);
var popup = new OpenLayers.Popup.FramedCloud("",
marker.lonlat,
new OpenLayers.Size(200, 200),
el.text,
null, true);
(function(p, m){
map.addPopup(p);
p.hide();
map.events.register('click', m, (function(){
this.show();
}).bind(p, null));
})(popup, marker);
});
</script>
所以基本上,当我单击其中一个标记时,所有弹出窗口都会变为可见。这似乎是经典的 JavaScript 闭包陷阱,但我应该如何注册 OpenLayers 事件,以便它只触发我单击的一个标记?
问题很简单,我只需要将事件注册到标记即可。不知道我是怎么把这些例子搞混的,可能会被混淆,因为标记本身是作为参数给出的。
m.events.register('click', m, (function(){
this.show();
}).bind(p, null));
我有以下代码,我试图在其中添加一些标记到 OpenStreetMaps 和 onClick 它们会触发自己的弹出窗口。 lonLats 是一个数组,包含具有经度、纬度和文本属性的对象。代码大致如下
<div id="mapdiv"></div>
<script src="http://www.openlayers.org/api/OpenLayers.js"></script>
<script>
var map = new OpenLayers.Map("mapdiv");
map.addLayer(new OpenLayers.Layer.OSM());
var projection = new OpenLayers.Projection("EPSG:4326"); // transform from WGS 1984
var mapProjection = map.getProjectionObject(); // // to Spherical Mercator Projection
var zoom=16;
var markers = new OpenLayers.Layer.Markers( "Markers" );
map.addLayer(markers);
map.setCenter (new OpenLayers.LonLat(lonLats[0].lon, lonLats[1].lat).transform(projection, mapProjection), zoom);
lonLats.forEach(function(el){
var lonLat = new OpenLayers.LonLat(el.lon, el.lat).transform(projection, mapProjection);
var marker = new OpenLayers.Marker(lonLat);
markers.addMarker(marker);
var popup = new OpenLayers.Popup.FramedCloud("",
marker.lonlat,
new OpenLayers.Size(200, 200),
el.text,
null, true);
(function(p, m){
map.addPopup(p);
p.hide();
map.events.register('click', m, (function(){
this.show();
}).bind(p, null));
})(popup, marker);
});
</script>
所以基本上,当我单击其中一个标记时,所有弹出窗口都会变为可见。这似乎是经典的 JavaScript 闭包陷阱,但我应该如何注册 OpenLayers 事件,以便它只触发我单击的一个标记?
问题很简单,我只需要将事件注册到标记即可。不知道我是怎么把这些例子搞混的,可能会被混淆,因为标记本身是作为参数给出的。
m.events.register('click', m, (function(){
this.show();
}).bind(p, null));