web-dev-qa-db-ja.com

InvalidValueError：initAutocompleteはGooglePlacesおよびAutocompleteAPIの関数ではありません

私が壁にぶつかったときにあなたが助けてくれることを願っています。私はGoogleのPlacesAPIを使うのもまったく新しいです。

これから説明する2つの部分が分離して実行されている場合、コードは正常に機能するため、まだコードを投稿するつもりはありません。

Googleが提供するJavascriptの例から機能するオートコンプリートAPIに加えて、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>

これにより、「このページにGoogle Maps APIを複数回含めました。これにより、予期しないエラーが発生する可能性があります。」それで、これを調べた後、私はこのように両方をマージしました：

<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

これらのスクリプトがマージされていない場合、これらのエラーは発生しませんが、その後、PlacesAPIを必要とする関数が機能しなくなったことに気付きました。オートコンプリートAPIリファレンスを削除すると、Places関数が機能します。

これらの両方を一緒に機能させ、示されているようにこれらをマージし、「機能ではない」問題を解決する方法についてのアイデアはありますか？

何か提案があれば大歓迎です。本当にコードを見る必要があるかどうか教えてください。

よろしくお願いします、ステフ

javascriptautocompletegoogle-places-apigeocodinggoogle-places
9
Stephanie Nicolaou

次のように、includeスクリプトを1回だけ使用する必要があります。

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

スクリプトを含めるときは、「callback」パラメータを省略していることに注意してください。次に、次のようにウィンドウの読み込み時にinitAutocompleteを読み込みます。

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

おそらく、頭にgmapsスクリプトを含める必要があります。そうしないと、jsをインラインに配置した場合に、「google isnotdefined」エラーが発生します。

10
Bobz