2016-01-06 78 views
0

我正在嘗試在下面的腳本中獲取區域字段的內容,以便我可以在輸入地址時自動顯示區域。 我會在js腳本中創建一個名爲getRegion()的新函數嗎?使用jQuery地址選擇器獲取區域名稱

我該怎麼做?

<!DOCTYPE HTML> 
 
<html> 
 
    <head> 
 
    <meta charset="utf-8"/> 
 

 
    <title>placepicker</title> 
 

 
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 
 

 
    <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script> 
 
    <script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script> 
 
    <link href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet"></link> 
 
    <link href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css" rel="stylesheet"></link> 
 

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

 
    <script src="http://www.jqueryscript.net/demo/jQuery-Location-Autocomplete-with-Google-Maps-Places-Library-Placepicker/src/js/jquery.placepicker.js"></script> 
 

 
    <script> 
 

 
     $(document).ready(function() { 
 

 
     // Basic usage 
 
     $(".placepicker").placepicker(); 
 

 
     // Advanced usage 
 
     $("#advanced-placepicker").each(function() { 
 
      var target = this; 
 
      var $collapse = $(this).parents('.form-group').next('.collapse'); 
 
      var $map = $collapse.find('.another-map-class'); 
 

 
      var placepicker = $(this).placepicker({ 
 
      map: $map.get(0), 
 
      placeChanged: function(place) { 
 
       console.log("place changed: ", place.formatted_address, this.getLocation()); 
 
      } 
 
      }).data('placepicker'); 
 
     }); 
 

 
     }); // END document.ready 
 

 
    </script> 
 

 
    <style> 
 

 
     .placepicker-map { 
 
     width: 100%; 
 
     height: 300px; 
 
     } 
 

 
     .another-map-class { 
 
     width: 100%; 
 
     height: 300px; 
 
     } 
 

 
     .pac-container { 
 
     border-radius: 5px; 
 
     } 
 

 
    </style> 
 

 
    </head> 
 

 
    <body> 
 

 

 
    <div class="container"> 
 

 
     <h1>Basic usage</h1> 
 
     <div class="row" data-example> 
 
     <div class="col-md-6"> 
 
      <div class="form-group"> 
 
      <input class="placepicker form-control" placeholder="Enter a location"/> 
 
      </div> 
 
     </div> 
 
     </div> 
 
    </div> 
 

 

 
    </body> 
 

 
</html>

回答

0

確定。在函數initAutoComplete() 我可以顯示place.address_components [2] .long_name

這是一個區域的名稱:

我已經得到了良好的尖端,第一。

+0

問題解決@glochen G Uyirr –