2017-04-25 60 views
-1

我正在嘗試將搜索框添加到自動完成功能,這會使Google地圖轉到搜索框中的位置。到目前爲止沒有太多的運氣找出爲什麼它不工作。Google地圖自動完成搜索框不起作用

---------- HTML

<div class="input-group location" > 
     <input type="text" id="location" placeholder="Enter Location"> 
     <span class="input-group-addon"><i class="fa fa-map-marker geolocation" data-toggle="tooltip" data-placement="bottom" title="Find my position"></i></span> 
</div> 

---------- JavaScript的

var input = document.getElementById('#location') ; 
    var autocomplete = new google.maps.places.Autocomplete(input, { 
     types: ["geocode"] 
    }); 

    autocomplete.bindTo('bounds', map); 
    google.maps.event.addListener(autocomplete, 'place_changed', function() 
    { 
     var place = autocomplete.getPlace(); 
     if (!place.geometry) { 
      return; 
     } 
     if (place.geometry.viewport) { 
      map.fitBounds(place.geometry.viewport); 
      map.setZoom(14); 
     } else { 
      map.setCenter(place.geometry.location); 
      map.setZoom(14); 
     } 

     marker.setPosition(place.geometry.location); 
     //marker.setVisible(true); 

     var address = ''; 
     if (place.address_components) { 
      address = [ 
       (place.address_components[0] && 
       place.address_components[0].short_name || ''), 
       (place.address_components[1] && 
       place.address_components[1].short_name || ''), 
       (place.address_components[2] && 
       place.address_components[2].short_name || '') 
      ].join(' '); 
     } 
    }); 

回答

2

你的代碼工作,唯一的問題是與你輸入元素,你已經使用#標籤來獲取輸入,這裏是你的工作代碼,

Your Code

需要更改的是,

var input = document.getElementById('location'); //刪除#標籤