如何使用 API 使谷歌地址自动填充，用数字和街道替换完整地址？答案

【问题标题】：How to make google address autofill using API, to replace full address with number & street?如何使用 API 使谷歌地址自动填充，用数字和街道替换完整地址？
【发布时间】：2020-06-20 09:20:58
【问题描述】：

我正在使用谷歌 API 来自动填写地址表格。现在我找到了填写完整地址的代码，它会自动填充图片链接#1 中的所有字段，如图所示。我隐藏了不需要的街道号码和路线字段。

我正在寻找的是，在我选择地址后，我希望我输入的地址栏不在该字段栏中显示城市、州和国家。我希望自动填充看起来像图片链接 #2 中显示的那样，其中地址字段仅用数字和街道替换完整地址，并且不包括城市、州、国家/地区。输入时我选择了图片链接#3中显示的地址，它会自动填充图片链接#2中显示的内容。

有谁知道点击地址后如何用数字和街道替换完整地址？我在这里使用了这个链接中的 html 和 jscript： https://github.com/solodev/address-auto-complete

图片链接#1：https://imgur.com/a/oCAAs4C

图片链接#2：https://imgur.com/a/psaz3J4

图片链接#3：https://imgur.com/a/xQMNjpy

【问题讨论】：

标签： javascript html api google-maps google-maps-api-3

【解决方案1】：

尝试如下修改fillInAddress：

function fillInAddress() {
  // Get the place details from the autocomplete object.
  var place = autocomplete.getPlace();

  for (var component in componentForm) {
    document.getElementById(component).value = '';
    document.getElementById(component).disabled = false;
  }

  // Get each component of the address from the place details
  // and fill the corresponding field on the form.
  var streetAddress = '';
  for (var i = 0; i < place.address_components.length; i++) {
    var addressType = place.address_components[i].types[0];
    if (componentForm[addressType]) {

      if (addressType === 'street_number') {
        streetAddress += place.address_components[i][componentForm[addressType]];
      } else if (addressType === 'route') {
        if (streetAddress.length) {
          streetAddress += ' ';
        }
        streetAddress += place.address_components[i][componentForm[addressType]];
      }

      var val = place.address_components[i][componentForm[addressType]];
      document.getElementById(addressType).value = val;
      document.getElementById('autocomplete').value = streetAddress;
    }
  }
}

Working jsfiddle 基于the demo。

希望这会有所帮助！

【讨论】：

很高兴听到并乐于提供帮助！ :)