Javascript Google Maps API，InfoWindow domready事件处理程序出错

我正在一个信息窗口中为众包位置数据设置一个表单。我已经启动并运行了所有程序，但是当信息窗口弹出时，我试图将lat和lng值复制到表单元素中

我在map div上成功地使用了其他事件侦听器，但是当我在info窗口中使用

domready

事件处理程序时，我得到一个错误：

“未捕获的TypeError:无法读取未定义的属性'\uuuue3'。”

问题似乎在

domready

事件侦听器中

// Global Variables
var map, markerWindow, newMarker;

function updateMarkerPosition(latLng) {
    alert(latLng);
    var lat = latLng.lat().toString();
    var lng = latLng.lng().toString();
    google.maps.event.addListener(markerWindow, "domready", function() {
        alert(latLng); // debug alert
        document.getElementById('lat').value = lat.slice(0,6);
        document.getElementById('lng').value = lng.slice(0,7);
    });
}
function placeMarker() {
// Setup html form markup for marker pop-up infowindow
    var html = '<div id="htmlform">' +
        '<form action="process.php" method="post" ' +
        'id="mapForm"> <fieldset> <label for="contact">' +
        'Email:</label><input type="text" name="contact"/>' +
        '<br/> <label for="date">Date:</label><input ' +
        'type="text" name="date"/><br/> <label for="desc">' +
        'Description of Sighting:</label><input type="text" ' +
        'name="desc"/><br/> <label for="lat">Latitude:</label>' +
        '<input type="text" name="lat" id="lat" class="location"/><br/>' +
        '<label for="lng">Longitude:</label><input type="text"' +
        'name="lng" id="lng" class="location"/><br/><input type="submit"' +
        'value="Post Sighting!" onclick="saveData()"/> </fieldset></form>' +
        '</div>';
    var newMarker = new google.maps.Marker( {
        draggable: true,
        map: map,
        animation: google.maps.Animation.DROP,
        title: "I'm draggable!",
    });
    var markerWindow = new google.maps.InfoWindow({
        content: html,
    }); 
    google.maps.event.addListener(map, "click", function(e) {
        newMarker.setPosition(e.latLng);
        markerWindow.open(map, newMarker);
        map.setCenter(e.latLng);
        updateMarkerPosition(newMarker.getPosition());
    });             
    google.maps.event.addListener(newMarker, 'dragstart', function() {
        markerWindow.close();
    });
    google.maps.event.addListener(newMarker, 'dragend', function(e) {
        newMarker.setPosition(e.latLng);
        markerWindow.open(map, newMarker);
        updateMarkerPosition(newMarker.getPosition());
    });
}
// Run when DOM window loads
function initialize() {
    map = new google.maps.Map(document.getElementById('map_canvas'),{
        zoom: 8,
        center: new google.maps.LatLng(38.487, -75.641),
        mapTypeId: google.maps.MapTypeId.ROADMAP
    });
    placeMarker();
}
google.maps.event.addDomListener(window, 'load', initialize);

//全局变量
var图、markerWindow、newMarker；
函数更新标记位置（latLng）{
警报（latLng）；
var lat=latLng.lat（）.toString（）；
var lng=latLng.lng（）.toString（）；
google.maps.event.addListener（markerWindow，“domready”，function（））{
警报（latLng）；//调试警报
document.getElementById（'lat'）。value=lat.slice（0,6）；
document.getElementById（'lng'）。value=lng.slice（0,7）；
});
}
函数placeMarker（）{
//设置标记弹出信息窗口的html表单标记
var html=''+
'  ' +
'电子邮件：'+
“
日期：
”+
'观测说明：
纬度：'+
“
”+
“经度：
”+
'';
var newMarker=新的google.maps.Marker（{
真的，
地图：地图，
动画：google.maps.animation.DROP，
标题：“我是拖拉！”，
});
var markerWindow=new google.maps.InfoWindow({
内容：html，
}); 
google.maps.event.addListener（映射，“单击”，函数（e）{
新标记。设置位置（如板条）；
markerWindow.open（map，newMarker）；
地图设置中心（e.latLng）；
updateMarkerPosition（newMarker.getPosition（））；
});             
google.maps.event.addListener（newMarker，'dragstart'，function（）{
markerWindow.close（）；
});
google.maps.event.addListener（newMarker，'dragend'，function（e）{
新标记。设置位置（如板条）；
markerWindow.open（map，newMarker）；
updateMarkerPosition（newMarker.getPosition（））；
});
}
//在加载DOM窗口时运行
函数初始化（）{
map=new google.maps.map（document.getElementById（'map_canvas'）{
缩放：8，
中心：新google.maps.LatLng（38.487，-75.641），
mapTypeId:google.maps.mapTypeId.ROADMAP
});
placeMarker（）；
}
google.maps.event.addDomListener（窗口“加载”，初始化）；

好吧，我没有超时就完成了

// Global Variables
var map, markerWindow, newMarker;

function placeMarker() {
// Setup html form markup for marker pop-up infowindow
    var html = '<div id="htmlform">' +
        '<form action="process.php" method="post" ' +
        'id="mapForm"> <fieldset> <label for="contact">' +
        'Email:</label><input type="text" name="contact"/>' +
        '<br/> <label for="date">Date:</label><input ' +
        'type="text" name="date"/><br/> <label for="desc">' +
        'Description of Sighting:</label><input type="text" ' +
        'name="desc"/><br/> <label for="lat">Latitude:</label>' +
        '<input type="text" name="lat" id="lat" class="location"/><br/>' +
        '<label for="lng">Longitude:</label><input type="text"' +
        'name="lng" id="lng" class="location"/><br/><input type="submit"' +
        'value="Post Sighting!" onclick="saveData()"/> </fieldset></form>' +
        '</div>';
    var newMarker = new google.maps.Marker( {
        draggable: true,
        map: map,
        animation: google.maps.Animation.DROP,
        title: "I'm draggable!",
    });
    var markerWindow = new google.maps.InfoWindow({
        content: html,
    }); 
    google.maps.event.addListener(map, "click", function(e) {
        newMarker.setPosition(e.latLng);
        markerWindow.open(map, newMarker);
        map.setCenter(e.latLng);
    });             
    google.maps.event.addListener(newMarker, 'dragstart', function() {
        markerWindow.close();
    });
    google.maps.event.addListener(newMarker, 'dragend', function(e) {
        newMarker.setPosition(e.latLng);
        markerWindow.open(map, newMarker);
    });
    google.maps.event.addListener(markerWindow, 'domready', function() {
      latLng = newMarker.getPosition();
      var lat = latLng.lat().toString();
      var lng = latLng.lng().toString();
      document.getElementById('lat').value = lat.slice(0,6);
      document.getElementById('lng').value = lng.slice(0,7);
    });
}
// Run when DOM window loads
function initialize() {
    map = new google.maps.Map(document.getElementById('map_canvas'),{
        zoom: 8,
        center: new google.maps.LatLng(38.487, -75.641),
        mapTypeId: google.maps.MapTypeId.ROADMAP
    });
    placeMarker();
}

google.maps.event.addDomListener(window, 'load', initialize);

---

非常感谢，我现在可以不再把头撞在墙上了。你原来的问题仍然很有趣。从理论上讲，这应该行得通，如果我发现一些相关的东西，我会再加上一条评论。即使它能工作，我也不太喜欢超时解决方案。我用一个版本更新了答案，其中超时在placeMarker中。每次调用updateMarkerPosition时添加一个新的侦听器可能会有一些有趣的事情。我无法解释为什么我们在将侦听器置于UpdateMarkerPosition时遇到问题。是否存在计时器会失败的情况？我对js非常陌生，我可以看出它比在infowindow domready上运行侦听器更像是一种黑客行为。功能会改变吗？或者侦听器会产生更好的结果吗；我还不熟悉谷歌地图API和异步。活动（大约一个月前开始）。我想我现在可以解释为什么原始代码不起作用了：markerWindow侦听器被分配给了一个未定义的变量，因为侦听器是在代码运行并看到UpdateMarkerPosition时立即创建的，而markerWindow只有在初始化运行后才被定义，这必须等待“窗口”加载。答案是在定义markerWindow之后添加侦听器。我认为超时破解在速度非常慢的计算机上失败，因为信息窗口的显示时间太长。

function updateMarkerPosition(latLng) {
    var lat = latLng.lat().toString();
    var lng = latLng.lng().toString();

    setTimeout(function() { 
      document.getElementById('lat').value = lat.slice(0,6);
      document.getElementById('lng').value = lng.slice(0,7);
    }, 200);
}