Ple*_*ork 6 javascript autocomplete google-maps-api-3
我有以下 javascript 代码,它在作为地址一部分的不同输入文本框上执行谷歌地图自动完成。
function startAutoComplete() {
var address = document.getElementById("addressId");
var city = document.getElementById("cityId");
var state = document.getElementById("stateId");
var zip = document.getElementById("zipId");
//option for autocomplete
var option = {types: ['geocode'], componentRestrictions: {country: 'us'}};
//autocomplete for address textbox
autocomplete = new google.maps.places.Autocomplete(address, option);
google.maps.event.addListener(autocomplete, 'place_changed', function() {
var place = autocomplete.getPlace();
//parses the result object and populates the other textboxes accordingly
for(i=0; i<place.address_components.length; i++)
{
if(place.address_components[i].types[0] == 'locality')
city.value = place.address_components[i].long_name;
if(place.address_components[i].types[0] == 'administrative_area_level_1')
state.value = place.address_components[i].short_name;
if(place.address_components[i].types[0] == 'postal_code')
zip.value = place.address_components[i].long_name;
}
/* Here is the PROBLEM */
address.value = place.name;
});
Run Code Online (Sandbox Code Playgroud)
但是,当我尝试更新正在使用完整地址的缩短版本自动完成的文本框时(所以这里只是街道号码和街道名称)。完整地址文本框中的值不会更改。我尝试使用 jquery 并在文本框上使用 setAttribute() 设置 value 属性。我究竟做错了什么?
我找到了一个非常临时的解决方案。看来,如果您故意创建一个错误,它会解除谷歌地图自动完成与原始文本框的绑定,并显示带有更新值的原始文本框。这并不是一个真正的解决方案,但它是一个开始
//Created this variable that stores the pac-container
var element = document.getElementsByClassName("pac-container");
//inside the addListener() function I added this to create a DOM error
element[0].childNodes[0].childNodes[0].removeChild();
Run Code Online (Sandbox Code Playgroud)
javascript 抛出一个错误,但它至少允许我使用“.value”在文本框中输入我想要的内容
同样,这不是一个解决方案,而是一个开始。我希望我们能找到更好的解决方案。
| 归档时间: |
|
| 查看次数: |
5826 次 |
| 最近记录: |