如何限制谷歌地图自动完成答案

【问题标题】：How to restrict google map autocomplete如何限制谷歌地图自动完成
【发布时间】：2019-09-11 15:01:31
【问题描述】：

问题 1) 我正在尝试通过下面的自动完成代码搜索邮政编码（英国）

例如，如果我搜索 NE237AP- 这就是我得到的 Annitsford Drive, Dudley, Cramlington NE23 7AP, UK

但如果我搜索街道名称，则省略邮政编码 安尼茨福德大道 - 我明白了 安尼茨福德大道，安尼茨福德，克拉姆灵顿，英国

为什么会这样。

问题 2) 我如何才能将上面的邮政编码结果用于另一个文本框。

问题 3) 有没有办法限制在英国 - 看到许多 sn-ps 代码，但似乎没有一个有效，代码如下。

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css" />




  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>


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

<script>
  google.maps.event.addDomListener(window, 'load', initialize);
    function initialize() {
      var input = document.getElementById('autocomplete_search');
      var autocomplete = new google.maps.places.Autocomplete(input);
      autocomplete.addListener('place_changed', function () {
      var place = autocomplete.getPlace();

      // place variable will have all the information you are looking for.
      $('#lat').val(place.geometry['location'].lat());
      $('#long').val(place.geometry['location'].lng());
    });
  }
</script>


  <title>Google Places Autocomplete InputBox Example Without Showing Map - Tutsmake.com</title>
 <style>
    .container{
    padding: 10%;
    text-align: center;
   } 
 </style>
</head>
<body>

<div class="container">
    <div class="row">
        <div class="col-12"><h2>Google Places Autocomplete InputBox Example Without Showing Map</h2></div>
        <div class="col-12">
            <div id="custom-search-input">
                <div class="input-group">
                    <input id="autocomplete_search" name="autocomplete_search" type="text" class="form-control" placeholder="Search" />
                    <input type="hidden" name="lat">
                    <input type="hidden" name="long">
                </div>
            </div>
        </div>
    </div>
</div>
</body>
</html>

【问题讨论】：

请在一个问题中只问一个问题。
你能帮忙吗？
查看How to Ask 并提出一个好问题
那是不是……有没有关于如何回答的页面……

标签： javascript google-maps googleplacesautocomplete

【解决方案1】：

您没有获得邮政编码详细信息，因为地址 Annitsford Drive, Annitsford, Cramlington, UK 本身实际上被多个邮政编码所覆盖，例如 NE23 7AP、NE23 7AX 等。
您可以参考示例代码here，它获取数据并以地址形式填充数据。请注意，您可能需要更改上述示例中的组件以适应相应区域的地址格式。
据此documentation：

Use the componentRestrictions option to restrict the autocomplete search to a particular country.

在您的情况下，在您的初始化函数中，您可以使用以下行将自动完成预测限制为英国：

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

【讨论】：

1. Annitsford Drive 只有 NE237AP - 但在任何其他地址附近使用时，它不显示邮政编码。 NE23 7AX = 莫里斯球场