Javascript 谷歌将自动完成功能放在动态输入上

你好

我正在尝试使用以下代码在动态创建的输入上添加Google Places Autocomplete：

var _autocompletor=0；
函数assignAutoCompl（\u id）
{
var_autocomplete=新的google.maps.places.autocomplete（document.getElementById（_id））；
_setTypes（['geocode']）；
google.maps.event.addListener（_autocomplete，'place_changed'，function（）
{
//处理代码
});
}
函数CreateElem（）
{
var\u id=“AutoCompl”+\u autocompleter；
_自动采样计数器++；
var container=document.getElementById（'AutoComplInputs'）；
container.innerHTML+=“
”+\u id；
var_elem_for_upd=document.createElement（“输入”）；
_elem_for_upd.type=“text”；
_elem_for_upd.id=_id；
container.appendChild（_elem_表示_upd）；
assignAutoCompl（_id）；
}

但当我按下按钮时，“自动完成”只在最后一次输入时起作用，所有先前的操作都会被破坏。我认为它可以连接到输入的动态创建，因为下面的代码工作得很好：

var _autocompletor=0；
函数assignAutoCompl（\u id）
{
document.getElementById（_id）.hidden=false；
var_autocomplete=新的google.maps.places.autocomplete（document.getElementById（_id））；
_setTypes（['geocode']）；
google.maps.event.addListener（_autocomplete，'place_changed'，function（）
{
//处理代码
});
}
函数CreateElem（）
{
assignAutoCompl（“AutoCompl0”）；
转让AutoCompl（“AutoCompl1”）；
}

---

我不明白我做错了什么…

不要使用

innerHTML

向

容器添加内容，您将丢失绑定到现有元素的所有处理程序

改为使用appendChild：

container.appendChild(document.createElement('br'));
container.appendChild(document.createTextNode(_id));