javascript - 仅在选择输入时获取谷歌位置自动完成值

Question

我想从我的 Google 位置获取数据，仅当用户选择了下拉选项之一时自动完成输入。我不想要像“shdkajdjjdoiacn”这样的输入。我怎样才能做到这一点？我使用的代码是:

function initialize() {
  var mapOptions = {};
  var input = /** @type {HTMLInputElement} */(document.getElementById('searchTextField'));
  var autocomplete = new google.maps.places.Autocomplete(input);
}
$('button').click(function(){
console.log(autocomplete.description);
});

google.maps.event.addDomListener(window, 'load', initialize);

Answer 1

Autocomplete() 函数在用户退出输入字段时引发事件。您可以使用该事件来填充一组隐藏字段，其中包含自动完成功能提供的值。如果没有从下拉列表中做出有效选择，这些值将保持空白，因此您可以根据这些字段是否包含数据来构建您的程序逻辑。自动完成在不同字段中提供的值示例:街道、城市、州、国家/地区、LatLng 坐标。

为此，在您的 initialize() 函数中添加类似于以下的代码:

function initialize() {
  /* existing lines of code */
  var autocomplete = new google.maps.places.Autocomplete(input);

  /* When user selects an address from the dropdown, 
     populate the address fields in the form */
  google.maps.event.addListener(autocomplete, 'place_changed', function() {
                fillInAddress();
            });
}

接下来，创建您的 fillInAddress() 函数，它看起来类似于以下内容。请看this reference link , 以获得有关如何使用它的完整详细信息。

function fillInAddress() {
    /* Get the place details from the Autocomplete object. */
    /* The Autocomplete.getPlace() call retrieves a PlaceResult object */

    var place = autocomplete.getPlace();

    /* Use data from place.address_components[] according to your needs */
    /* For reference, use the link: */
    /* https://developers.google.com/maps/documentation/javascript/places#place_details_results */
}