我的 googleplaceautocomplete 脚本需要帮助。我花了将近 58 个小时，但仍然不知道如何获得解决方案。
如果我输入 20 street 并单击选项列表结果，它会返回完整地址： 20 街，洛杉矶，加利福尼亚，美国。虽然我只想显示 20 条街道。不知何故，我设法只获得了街道地址。
但问题是，当我单击任何选择列表结果（下拉结果）时，它会首先在文本框中返回完整地址，然后我的脚本会在那里返回我的地址。当用户单击下拉结果时，我试图停止在文本框中填充完整地址，但我找不到解决方案。
你可以在这里查看我的代码：http://pastebin.com/h9qkhLQw
您可以在此处查看我的实时示例：http://bhargavshastri.com/gmap-streetaddress/dipu/2.html
我已经尝试了 1 周。任何帮助将不胜感激。
【问题讨论】：
标签： javascript jquery google-maps google-maps-api-3 google-places-api
这当然不是最优雅的解决方案，但我一直在努力寻找一种通过公开的 API 来实现它的方法......
我使用了第二个输入字段（最初隐藏在自动完成输入字段后面），然后在从自动完成列表中选择一个位置时将其带到前面（因此它隐藏了真正的自动完成）。这可以防止用户看到在文本框中填充的完整地址。有关演示，请参阅 this Fiddle。
HTML：
<div id="locationField">
<input id="autocomplete" placeholder="Enter your address" type="text" onchange="hideAutocomplete()" />
<!-- Hidden field -->
<input id="autocompleteDummy" type="text" />
</div>
CSS：
#autocomplete,
#autocompleteDummy {
position: absolute;
top: 0px;
left: 0px;
width: 99%;
}
#autocompleteDummy {
z-index: -1;
}
Javascript：
/*
* Function called when the value in the autocomplete textbox changes so it hides the real autocomplete and displays the 'fake' one
*/
function hideAutocomplete() {
// Populate the fake autocomplete with the text typed by the user - this prevents a blank box appearing
document.getElementById('autocompleteDummy').value = document.getElementById('autocomplete').value;
// Display the fake autocomplete
document.getElementById('autocompleteDummy').style.zIndex = 1;
// Hide the real autcomplete
document.getElementById('autocomplete').style.zIndex = -1;
}
您还需要修改您的 initAutocomplete() 函数以在填充地址字段后显示真正的自动完成功能。为此，请在方法结束之前和 for 循环之后添加以下行：
// Display the real autocomplete and hide the fake one
document.getElementById('autocomplete').style.zIndex = 1;
document.getElementById('autocompleteDummy').style.zIndex = -1;
我很想看看是否有人能提出更好的解决方案，因为这对我来说仍然有点“老套”。
【讨论】：