0

我正在尝试创建两个带有两个标记的地图（每张地图上有一个标记）。

拖动标记时，其位置在页面中的 DIV 元素中更新。在移动地图时，标记会移动到地图的中心，并且 DIV 元素会再次更新。

我已经创建了函数来进行相应的更改。为了确定要检查或移动哪个标记或地图，我在函数中传递了地图或标记变量。

但是，地图显示出奇怪的行为。在尝试拖动标记时，它会附加到我的鼠标指针上，并且永远不会放在地图上，也不会触发任何事件。此外，移动地图不会做任何事情。

如果我为表单中的每个标记或地图分别声明函数

addListener(marker, 'drag', function() { //some code });

它工作得很好。

不知道出了什么问题。

这是代码片段：

//add a listener for the marker movement
google.maps.event.addListener(marker_start, 'drag', handleMarkerDrag(marker_start, 1));
google.maps.event.addListener(marker_end, 'drag', handleMarkerDrag(marker_end, 2));

//add a listener for the map
google.maps.event.addListener(map_start, 'dragend', handleMapDragend(map_start, marker_start, 1));
google.maps.event.addListener(map_end, 'dragend', handleMapDragend(map_end, marker_end, 2));

以及处理事件的函数：

function handleMarkerDrag(marker, x)
{
    //get the current location of the marker
    var marker_pos = marker.getPosition();
    //convert lat-lang datastructure into individual latitude and longitude
    var lat = marker_pos.lat();
    var lng = marker_pos.lng();
    //now update the content in the html page
    if(x == 1)
    {
        document.getElementById("longitude_start").innerHTML = lng+'<input type="hidden" name="longitude_start" value='+lng+'>';
        document.getElementById("latitude_start").innerHTML = lat+'<input type="hidden" name="latitude_start" value='+lat+'>';
    }
    else
    {
        document.getElementById("longitude_end").innerHTML = lng+'<input type="hidden" name="longitude_end" value='+lng+'>';
        document.getElementById("latitude_end").innerHTML = lat+'<input type="hidden" name="latitude_end" value='+lat+'>';
    }   
}

function handleMapDragend(map, marker, x)
{
    //get the current location of the marker
    var marker_pos = map.getCenter();
    //set marker to the enter of the map
    marker.setPosition(marker_pos);
    //convert lat-lang datastructure into individual latitude and longitude
    var lat = marker_pos.lat();
    var lng = marker_pos.lng();
    //now update the content in the html page
    if(x == 1)
    {

        document.getElementById("longitude_start").innerHTML = lng+'<input type="hidden" name="longitude_start" value='+lng+'>';
        document.getElementById("latitude_start").innerHTML = lat+'<input type="hidden" name="latitude_start" value='+lat+'>';
    }
    else
    {
        document.getElementById("longitude_end").innerHTML = lng+'<input type="hidden" name="longitude_end" value='+lng+'>';
        document.getElementById("latitude_end").innerHTML = lat+'<input type="hidden" name="latitude_end" value='+lat+'>';
    }       
}
4

1 回答 1

1

如果我以表格的形式分别为每个标记或地图声明该函数，则它可以正常工作。不知道出了什么问题。

不同之处在于第一次尝试提供了一个函数作为参数，但另一个尝试（失败）是函数调用（将立即执行）。

将函数调用包装成一个匿名函数：

//add a listener for the marker movement
google.maps.event.addListener(marker_start, 'drag', function(){handleMarkerDrag(marker_start, 1);});
google.maps.event.addListener(marker_end, 'drag', function(){handleMarkerDrag(marker_end, 2);});

//add a listener for the map
google.maps.event.addListener(map_start, 'dragend', function(){handleMapDragend(map_start, marker_start, 1);});
google.maps.event.addListener(map_end, 'dragend', function(){handleMapDragend(map_end, marker_end, 2);});
于 2013-11-01T22:07:27.693 回答