Google Places APIから都市をプルしようとすると、オートコンプリート検索が停止するのはなぜですか？

Question

私のWebページの基本テンプレートには、JQuery、Google Places API、オートコンプリート用のプラグイン、JSコードのリンクがあり、機能を呼び出すことができます。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> 

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDaa7NZzS-SE4JW3J-7TaA1v1Y5aWUTiyc&libraries=places"></script> 

<script src="https://cdnjs.cloudflare.com/ajax/libs/geocomplete/1.7.0/jquery.geocomplete.js"></script> 

<script> 

    $(function(){ 

    $("#searchBoxGlow").geocomplete() 

    }); 

    </script> 

は、最後に私はそれがこのスクリーンショットのように感嘆符をフリーズして示ししかし都市名

<input type="text" class="form-control input-lg" id="searchBoxGlow" name="city" placeholder="Search Cities"> 

を自動補完する検索フィールドを持っている：

Answer 1

これは私のために働きました。

<input type="text" id="searchplace" /> 
<input type="hidden" id="latitude" name="latitude"/> 
<input type="hidden" id="longitude" name="longitude"/> 

とそのHTML部分の中に、私はこれを追加しました：

<script type="text/javascript"> 
    function initialize() { 
     var searchBox = document.getElementById('searchplace'); 
     var autocomplete = new google.maps.places.Autocomplete(searchBox); 
     var latitude; 
     var longitude; 

     google.maps.event.addListener(autocomplete, 'place_changed', function() { 
      var place = autocomplete.getPlace(); 

      latitude = place.geometry.location.lat(); 
      longitude = place.geometry.location.lng(); 
      document.getElementById('latitude').value = place.geometry.location.lat(); 
      document.getElementById('longitude').value = place.geometry.location.lng();          
     });            
    } 
    google.maps.event.addDomListener(window, 'load', initialize); 
</script>