InvalidValueError: initAutocomplete не является функцией Google Places и Autocomplete API

Надеюсь, вы можете помочь, поскольку я врезался в стену, я также новичок в использовании API-интерфейсов Google Places.

Я пока не собираюсь публиковать какой-либо код, так как мой код отлично работает, когда две части, которые я собираюсь описать, выполняются изолированно.

Я использую Google Places в дополнение к Autocomplete API, работающему с примерами Javascript, предоставленными Google.

Первоначально у меня был следующий скрипт внизу моего документа:

<script src="https://maps.googleapis.com/maps/api/js?&libraries=places&callback=initAutocomplete" async defer></script>

и этот скрипт вверху моего документа:

 <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>

Это дало мне: «Вы несколько раз включили API Карт Google на этой странице. Это может вызвать непредвиденные ошибки». поэтому, изучив это, я объединил оба вместе следующим образом:

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=places&callback=initAutocomplete&sensor=false"></script>

Однако теперь, когда я это сделал, я получаю следующие ошибки:

InvalidValueError: initAutocomplete is not a function
TypeError: searchBox is undefined

Я не получаю эти ошибки, когда эти сценарии не объединены, но впоследствии я понял, что функции, требующие Places API, перестали работать. Если я удалю ссылку на Autocomplete API, функции Places будут работать.

Любые идеи о том, как я могу заставить их работать вместе, объединяя их, как показано, и решая проблему «не функции»?

Любые предложения будут очень признательны, пожалуйста, дайте мне знать, если вам действительно нужно увидеть код.

Заранее спасибо, Стеф


google-places-api javascript autocomplete geocoding google-places
person Stephanie Nicolaou    schedule 21.04.2016    source источник

Ответы (2)


arrow_upward
20
arrow_downward

Вы должны использовать скрипт include только один раз, например:

//maps.googleapis.com/maps/api/js?key=__API-KEY__&libraries=places

Обратите внимание, что вы опускаете параметр «обратный вызов» при включении скрипта. Затем загрузите initAutocomplete при загрузке окна, например:

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

Возможно, вам нужно будет включить скрипт gmaps в голову, или вы получите ошибку «google не определен», если вы поместите свой js в строку.

person Bobz    schedule 19.09.2016
comment
Да, это работает! Если вы хотите, чтобы JavaScript был в вашем внешнем JS-файле, а не на странице HTML/PHP, как в примере, это работает хорошо. Отбросьте обратный вызов, добавьте прослушиватель dom в свой JS. Работал как мечта! НО не забудьте геолокацию() onFocus... вам также нужно будет перенести это на внешний JS... - person OMNIA Design and Marketing; 13.04.2018
comment
У меня была та же проблема с использованием его с WordPress, но я заметил, что это происходит только в том случае, если моя функция автозаполнения была написана внутри функции загрузки JQuery, поэтому я переместил ее. Я не тестировал функцию загрузки vanilla js, но, тем не менее, обычно это должен быть тот же подход. - person Mueyiwa Moses Ikomi; 21.07.2019
comment
Это решение работает для меня. В моем случае я также удалил атрибут async из тега скрипта Maps API. - person Diego Somar; 20.09.2019
comment
это было единственное, что сработало для меня - person booky99; 15.07.2021

arrow_upward
4
arrow_downward

Только что попробовал это и обнаружил, что удаление атрибута asyc решает эту проблему. Даже при использовании обратного вызова в URL-адресе Google API для мест.

Удаление атрибута asyc — это меньшее исправление.

person ramulin    schedule 06.12.2019