javascript - Google map - 无法读取未定义的属性 '__e3_'

Question

我希望有人可以帮助我处理我的 Google Maps API 代码。

我已经设置了一个包含多个标记的 map ，该 map 可以成功运行，但是我想向标记添加单击事件，以便出现一个信息窗口，这就是我遇到问题的地方。

$(document).ready(function() {
    var script = document.createElement("script");
    script.type = "text/javascript";
    script.src = "http://maps.googleapis.com/maps/api/js?libraries=geometry&sensor=true&callback=mapInitialize";
    document.body.appendChild(script);
});
function mapInitialize() {
    var options = {  
        zoom: 5,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById('map_div'), options);
    geocoder = new google.maps.Geocoder();
    function codeAddress(markerValue, addressValue) {
        geocoder.geocode({ 'address': addressValue}, function(results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                map.setCenter(results[0].geometry.location);
                markerValue = new google.maps.Marker({
                    map: map,
                    position: results[0].geometry.location
                });
            }
        });
    }
    var marker1;
    codeAddress(marker1, '1 My Road, Somewhere, A1 1AA');
    var infowindow1 = new google.maps.InfoWindow({
        content: '<div class="infowindow"><strong><a href="http://mylink.com">Title</a></strong><br />Address details</div>'
    }); 
    google.maps.event.addListener(marker1, 'click', function() {
        infowindow1.open(map, marker1);  
    });
}

因此，当我包含 addListener 代码时，出现错误“无法读取未定义的属性‘_e3”。

我在这里阅读了其他类似问题的帖子，但我已经阅读了所有回复，即使他们有同样的问题，但没有一个对他们有用的解决方案对我有用，或者它们与 waht 无关我写了。

提前致谢。

Answer 1

这里有多个问题:

1. 您正在尝试修改 marker1传递给您的变量 codeAddress通过分配给参数名称从函数内部运行函数 markerValue . JavaScript 没有传递引用参数，所以 marker1不会以任何方式受到您为 markerValue 赋值的影响.所以稍后当你尝试用 marker1 做某事时，它仍然具有默认值 ( undefined )。

2. Google map 的 API 是异步的。您调用geocoder.geocode 开始这个过程，但它在codeAddress之后很久才完成已经回来了。

您需要将后续代码移到 codeAddress ，特别是来自 geocode 的完成回调.

类似这样的东西(完全未经测试，目的是为您指明正确的方向，而不是为您编写完美的解决方案):

function mapInitialize() {
    var options = {  
        zoom: 5,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById('map_div'), options);
    geocoder = new google.maps.Geocoder();
    function codeAddress(addressValue) {
        geocoder.geocode({ 'address': addressValue}, function(results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                var marker, infowindow1;

                map.setCenter(results[0].geometry.location);
                marker = new google.maps.Marker({
                    map: map,
                    position: results[0].geometry.location
                });

                infowindow = new google.maps.InfoWindow({
                    content: '<div class="infowindow"><strong><a href="http://mylink.com">Title</a></strong><br />Address details</div>'
                }); 
                google.maps.event.addListener(marker, 'click', function() {
                    infowindow.open(map, marker);  
                });
            }
        });
    }
    codeAddress('1 My Road, Somewhere, A1 1AA');
}