首页 文章

Google会出现自动填充和模糊问题

提问于
浏览
3

我有一个表单可以实现Google商家信息自动填充和填充其他文本字段 .

<script type="text/javascript">
    $(document).ready(function(){
        $('.noEnterSubmit').keypress(function(e){
            if ( e.which == 13 ) return false;
        });

        var updateAddress = {

        autocomplete: new google.maps.places.Autocomplete($("#Subscription_address")[0], {types: ['geocode']}),

        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(){$('#Subscription_address').val(streetAddress).blur(function(e){
                    this.value = this.streetAddress;
                });},50);
                $('#Subscription_city').val(suburb);
                $('#Subscription_state').val(state);
                $('#Subscription_zip').val(zip);
                $('#Subscription_country').val(country);
            });

        }
    };

    updateAddress.event();

    });
    </script>
    </head> 

<input class="noEnterSubmit input-large" name="Subscription[address]" id="Subscription_address" type="text">

我阻止表单提交输入按键 . 只有当用户输入按键时,焦点离开文本字段才能重置#Subscription_address,Google Places API会显示#Subscription_address的“未定义”值 .

当前tab按键和鼠标选择作为模糊事件按预期工作,以填充其他字段并仅在#Subscription_address字段中保留streetAddress .

使用JQuery如何允许用户使用enter keypress选择自动完成结果然后关注文本字段并保留选定的值?

1 回答

  • 1
    // update the textboxes
            setTimeout(function(){$('#Subscription_address').val(streetAddress).blur(function(e){
                this.value = streetAddress;
            });},50);
    

    我需要在模糊功能后删除this.streetAddress . 在下拉列表的DOM中,这有不同的上下文 .

相关问题