Мы используем API карт Google Maps на нашем сайте для нашего поля 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&libraries=places%2Cgeometry&callback=initMap&ver=1"></script>
</body>
</html>
Любая помощь с благодарностью.Спасибо