javascript - 未捕获的类型错误 : Cannot read property 'x' of undefined Google Map and jquery

Question

我寻找了有关此异常的许多答案，但我找到的所有解决方案都没有解决我的问题。

我正在使用 jQuery 和谷歌地图。我的 html 页面包含一些元素，以及一个包含许多函数和 ajax 调用的 .js 文件。

在 HTML 中:我将脚本放在正文的末尾:

<!-- here my .js file--> 
<script type="text/javascript" src="js/myFunctions.js"></script>
<!-- Google Map -->
<script src="https://maps.googleapis.com/maps/api/js?key=MyKey" async defer>
</script>
</body>

在 myFunctions.js 文件中:

我有一个 ajax 调用，它返回纬度和经度，我将其发送到创建 map 的函数:

initMap(parseFloat($(this).find("latitude").text()),
        parseFloat($(this).find("longitude").text()));

然后我调用 map 函数来创建 map :

var map;
initMap = function (lat, lan) {
    console.log(lat);
    map = new google.maps.Map(document.getElementById('locMapDiv'), {
        center: {lat:lat , lng: lan},
        zoom: 13
    });
}

一切工作正常，但是在控制台中，当我在 map 上拖动时，它显示错误:未捕获的类型错误:无法读取未定义的属性“x”。我不知道为什么会出现此错误，而拖动工作正常。

导致此错误的原因可能是什么？因为一切似乎都工作正常，即使拖动和缩放它也工作完美。

Answer 1

尝试颠倒包含脚本的顺序:

<script src="https://maps.googleapis.com/maps/api/js?key=MyKey" async defer>
<script type="text/javascript" src="js/myFunctions.js"></script>

并尝试在 load 函数中调用 init 函数，以确保 DOM 已完全加载:

google.maps.event.addDomListener(window, "load", , function () {
     initMap(parseFloat($(this).find("latitude").text()),
             parseFloat($(this).find("longitude").text()));
);

希望这有帮助。