【问题标题】:How to stop address from populating autocomplete with google places如何阻止地址使用谷歌地方填充自动填充
【发布时间】:2014-10-30 19:23:24
【问题描述】:

所以我在我的表单上有一个谷歌地图自动完成功能,当它获得一个位置时,它会占据该位置并对其进行格式化,以便所有正确的信息进入表单上的不同输入。

我遇到的问题是在“place_changed”事件触发自动完成填充输入之前。我想阻止最初的人口,而是用我想要在那里的东西来填充。

我尝试进行更改事件,但它似乎没有正确触发。这是我的代码:

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 然后检查 focusout 是一种解决方法,因为当我仅使用键盘选择一个位置时,它会尝试重新输入原始的完整字符串。

【问题讨论】:

    标签: javascript jquery google-maps autocomplete google-places-api


    【解决方案1】:

    在设置值之前触发模糊事件:

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

    【讨论】:

    • 天啊。一百万啤酒给你!像魅力一样工作。
    猜你喜欢
    • 2015-03-22
    • 2016-10-17
    • 1970-01-01
    • 2018-04-28
    • 1970-01-01
    • 1970-01-01
    • 2019-06-26
    • 2020-06-20
    • 2016-08-15
    相关资源
    最近更新 更多