为什么尝试从Google Places API中拉出城市时，我的自动填充搜索结果会冻结？

Question

在我的网页基本模板中，我有用于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>