如何解决Google InitMap不是函数的问题？

Question

我们在网站上使用Google Map Places API作为input字段。 当用户在输入字段上键入时，将显示建议

页面加载后，出现控制台错误，提示：

Uncaught (in promise) Vc {message: "initMap is not a function", name: "InvalidValueError", stack: "Error↵    at new Vc (https://maps.googleapis.com/m…s=places%2Cgeometry&callback=initMap&ver=1:145:96"}
Promise.then (async)
Oh @ js?key=some_valid_random_key&libraries=places%2Cgeometry&callback=initMap&ver=1:145
google.maps.Load @ js?key=some_valid_random_key&libraries=places%2Cgeometry&callback=initMap&ver=1:21
(anonymous) @ js?key=some_valid_random_key&libraries=places%2Cgeometry&callback=initMap&ver=1:230

 function initMap() { const autocompleteInputs = document.getElementById('autoaddress'); const options = { types: ['address'], componentRestrictions: { country: "us" } }; new google.maps.places.Autocomplete(autocompleteInputs, options); }

 <!doctype html> <html class="no-js" lang=""> <head> <meta charset="utf-8"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <title></title> <meta name="description" content=""> <meta name="viewport" content="width=device-width, initial-scale=1"> <script type="text/javascript" src="http://example.com/wp-includes/js/jquery/jquery.js?ver=1.12.4"></script> </head> <body> <form action="/form-action" method="GET"> <input id="autoaddress" name="address" type="text" placeholder="Address"> <button class="button button__primary">Show Address</button> </form> <script type="text/javascript" src="http://example.com/wp-content/themes/divi/scripts/custom.js"></script> <!-- where initmap function exists --> <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=some_valid_random_key&amp;libraries=places%2Cgeometry&amp;callback=initMap&amp;ver=1"></script> </body> </html>

任何帮助是极大的赞赏。 谢谢

Answer 1

请确保您的脚本必须在initMap()函数之前加载，还请在脚本中使用async和defer ，如下所示。

<script async defer
                src="https://maps.googleapis.com/maps/api/js?key=some_valid_random_key&amp;libraries=places%2Cgeometry&amp;callback=initMap&amp;ver=1">
        </script>

如何解决Google InitMap不是函数的问题？

问题描述

1 个解决方案

解决方案1
1 已采纳 2019-07-03 05:10:38

如何解决Google InitMap不是函数的问题？

问题描述

1 个解决方案

解决方案1 1 已采纳 2019-07-03 05:10:38

解决方案1
1 已采纳 2019-07-03 05:10:38