如何从与谷歌的地方填充自动完成停止地址 [英] How to stop address from populating autocomplete with google places

问题描述

所以，我有我的窗体上的谷歌地图自动完成，并且当它到达的地方需要它，这样所有正确的信息进入表单上输入不同的地方和格式。

SO I have a google maps autocomplete on a form of mine, and when it gets a place it takes the place and formats it so that all the correct information goes into different inputs on the form.

我遇到的问题是前place_changed事件触发的自动完成填充输入。我想prevent初始的人口，而是与我想在那里填充。

The issue I'm having is before the 'place_changed' event fires the autocomplete populates the input. I want to prevent that initial population and instead populate with what I want to be there.

我试着做一个改变事件，但它似乎没有正确触发。这里是我的code：

I tried doing a change event but it doesnt seem to fire correctly. Here is my code:

HTML

<input type="text" name="address1" value="1255 W Washington St" required="" class="form-control" id="id_address1" placeholder="Enter a location" autocomplete="var input = /** @type {HTMLInputElement} */(

JS：

document.getElementById('id_address1'));
var autocomplete = new google.maps.places.Autocomplete(input);
google.maps.event.addDomListener(input, 'keydown', function(e) { 
        if (e.keyCode == 13) { 
            e.preventDefault(); 
            console.log('enter');
        }
});
google.maps.event.addDomListener(input, 'focusout', function(e) {
    if ($('#id_address1').val() != $('#id_address1').attr('value')){
        $('#id_address1').val($('#id_address1').attr('value'));
    }
});off"

google.maps.event.addListener(autocomplete, 'place_changed', function() {
    var place = autocomplete.getPlace();
    if (place.address_components) {
        var address = '';

        for (var i = 0; i < place.address_components.length; i++){
            switch (place.address_components[i].types[0]){
                case 'street_number':
                    address = place.address_components[i].short_name;
                    break;
                case 'route':
                    address += ' ' + place.address_components[i].short_name;
                    break;
                case "locality":
                    $('#id_city').val(place.address_components[i].short_name);
                    break;
                case "administrative_area_level_1":
                    $('#id_state').val(place.address_components[i].short_name);
                    break;
                case "country":
                    $('#id_country').val(place.address_components[i].short_name);
                    break;
                case "postal_code":
                    $('#id_zip_code').val(place.address_components[i].long_name);
                    break;
                }
        }
        $('#id_address1').val(address);
        $('#id_address1').attr('value', address);
}

现在当设置ATTR，然后检查对事件的内容是一种解决方案，因为当我只用它尝试输入原来的满弦早在键盘选择的地方。

right now when the setting the attr and then checking on focusout is a workaround because when i select a place using just the keyboard it tries to input the original full string back in.

推荐答案

在设定值之前触发模糊事件：

Trigger the blur-event before you set the value:

$('#id_address1').trigger('blur').val(address);

这篇关于如何从与谷歌的地方填充自动完成停止地址的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！