Google지도 v3 API - 자동 완성 (주소)

Question

Google지도 애플리케이션의 자동 완성 작동을 시도합니다. 주소를 입력 할 때

<input type="text" class="clearText" id="address" name="address" value="" size=20 autocomplete="off"> 

자바 스크립트

var input = document.getElementById('address'); 
    var options = { 
     componentRestrictions: {country: 'au'} 
    }; 
    var autocomplete = new google.maps.places.Autocomplete(input, options); 

불행하게도 아무 일도 발생하지

HTML :

여기에 현재 코드입니다.

아이디어가 있으십니까? 사전에

감사합니다. 실제로 다음과 같은 오류 메시지가 표시됨 :

편집

catch되지 않는 형식 오류가 : 코드가 내지도 기능을 초기화에 배치하는 이유,

확실하지 않음 정의되지 않은

의 특성 '자동 완성'을 읽을 수 없습니다.

편집 2 : 수정 됨. 아래 답변.

Answer 1

가 수정되었습니다. 자동 완성 라이브러리는 실제로 별도로 명시 적으로로드해야하는 라이브러리입니다. 다음 줄이 문제를 해결했습니다.

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?libraries=places‌​&sensor=false"></scr‌​ipt> 

Answer 2

수정 사항이 적용됩니다. 나는 http://ubilabs.github.com/geocomplete/ 에 플러그 - 더 Geocomplete jQuery를 사용하고 있는데 자신의 홈 페이지의 지침이

<script src="http://maps.googleapis.com/maps/api/js?sensor=false&amp;libraries=places"></script> 

을 사용 말합니다 그러나 그것은 나를 위해 작동하지 않았다 같은 오류가 발생했다.

여기에 구글지도 API 대답에 대한 https://developers.google.com/maps/documentation/javascript/places?hl=en-EN#loading_the_library

Answer 3

감사 매트에 대한 설명서를 참조하십시오! 아무래도 libraries=places을 사용할 때 <script> 태그에 type="text/javascript" 속성을 생략하지 않는 것이 중요합니다.

은 작동하지 않습니다 :

<script src="http://maps.googleapis.com/maps/api/js?libaries=places&sensor=false&callback=initMap"></script> 
<script src="http://maps.googleapis.com/maps/api/js?libaries=places&sensor=false"></script> 

작품 : (initMap 기능이 정의와)

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?libraries=places&sensor=false"></script> 

콜백 변형도 작동합니다

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?libraries=places&sensor=false&callback=initMap"></script> 

이 서로 일치하는 것으로 보인다 SO answer과 일치하지 않으며 (official documentation과 일치하지 않음 URL의 key이 차이를 만듭니다.

Answer 4

는이 같은 스크립트 속성 '비동기을 연기'를 추가해야합니다 :

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