谷歌自动完成 HTMLInputElement 错误答案

【问题标题】：Google Autocomplete HTMLInputElement error谷歌自动完成 HTMLInputElement 错误
【发布时间】：2016-03-24 01:48:27
【问题描述】：

我正在使用 Google 自动完成功能并收到此错误

InvalidValueError: not an instance of HTMLInputElement

我认为谷歌有 getElementById 用于贬值

var input = /** @type {!HTMLInputElement} */(
  document.getElementById('pac-input'));

但是我不确定它的用法。下面是我的代码

var options ={
    types:['(cities)'],
};

var input = document.getElementById('destination');
var autocomplete = new google.maps.places.Autocomplete(input, options);
}

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

【问题讨论】：

标签： javascript google-api

【解决方案1】：

使用onFocus="functionName()"，它在输入标签上调用google.maps.autocomplete。

【讨论】：

【解决方案2】：

我也遇到了这个问题，用这个就可以了

  let searchInputField = document.getElementsByClassName('search-form')[0].getElementsByTagName('input')[0]

  let autocomplete = new google.maps.places.Autocomplete(searchInputField);

【讨论】：

请添加一些解释，说明为什么 OP 的代码不起作用以及您的工作。

【解决方案3】：

当你得到元素时，它会返回一个数组，所以：

    const memberPlace = $("#place");
    const memberAddress = $("#address");
    const options = {
        fields: ["address_components", "geometry", "icon", "name"],
        strictBounds: false,
        types: ["establishment"],
    };

    if (memberPlace.length) {
        new google.maps.places.Autocomplete(memberPlace[0], options);
    }

    if (memberAddress.length) {
        new google.maps.places.Autocomplete(memberAddress[0], options);
    }

【讨论】：

【解决方案4】：

检查你的函数是否在 $(document).ready 函数中或者你的 document.getElementById 不会被 js 找到（因为它试图在它出现在文档中之前找到它）

【讨论】：

【解决方案5】：

这是因为您覆盖了输入变量。如果您只使用 var input = /** @type {!HTMLInputElement} */( document.getElementById('pac-input'));或将“pac-input”替换为“destination”

【讨论】：