javascript - 在 google.maps.event.addListener() 中只显示街道地址

Question

我编写了一个小函数，它将使用google.maps.event.addListener(). 这是jsFiddle。

一切都正是我想要的，除了当用户完成输入并从street字段中移出注意力之外，我只想要input.

目前它看起来像这样：

但我希望它是这样的：

已经感谢您的帮助。干杯。

Answer 1

使用短暂的延迟来应用 streetAddress

setTimeout(function(){$('#address').val(streetAddress);},50);

Answer 2

上述解决方案非常适合自动完成各个地址字段。这是一个带有偏向结果的选项的实现，但是我在使用边界来偏向自动完成字段的结果时遇到了问题。这是我的jsFiddle。

var defaultBounds = new google.maps.LatLngBounds(
    new google.maps.LatLng(33.89028890,-117.5617340),
    new google.maps.LatLng(33.7706850,-117.6639850)
);

var updateAddress = {
    autocomplete: new google.maps.places.Autocomplete($("#address")[0], { 
        bounds: defaultBounds,
        types: ['geocode'],
        componentRestrictions: {country: 'us'}
    }),            
    event: function(){
        var self = this;    
        google.maps.event.addListener(self.autocomplete, 'place_changed', function() {
            var place = self.autocomplete.getPlace(),
                address = place.address_components,
                streetAddress = '',
                suburb = '',
                state = '',
                zip = '',
                country = '';

            for (var i = 0; i < address.length; i++) {
                var addressType = address[i].types[0];

                if (addressType == 'subpremise') {
                    streetAddress += address[i].long_name + '/';
                }
                if (addressType == 'street_number') {
                    streetAddress += address[i].long_name + ' ';
                }
                if (address[i].types[0] == 'route') {
                    streetAddress += address[i].long_name;
                }
                if (addressType == 'locality') {
                    suburb = address[i].long_name;
                }
                if (addressType == 'administrative_area_level_1') {
                    state = address[i].long_name;
                }
                if (addressType == 'postal_code') {
                    zip = address[i].long_name;
                }
                if (addressType == 'country') {
                    country = address[i].long_name;
                }
            }

            // update the textboxes
            setTimeout(function(){$('#address').val(streetAddress);},50);
            $('#suburb').val(suburb);
            $('#state').val(state);
            $('#zip').val(zip);
        });

    }
};

updateAddress.event();