2013-08-16 5 views
2

У меня есть форма, которая реализует Google Места для автозаполнения и заполнения других текстовых полей.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, а API Google Places показывает значение «Undefined» для #Subscription_address.

В настоящее время вкладка клавиатуры и мыши в качестве события размытия работает, как ожидается, заполнить другие поля и сохранить только адрес streetAddress в поле #Subscription_address.

Использование JQuery Как я могу разрешить пользователю выбирать результат автозаполнения с помощью клавиши ввода, затем сфокусировать текстовое поле и сохранить выбранное значение?

ответ

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

Мне нужно было удалить this.streetAddress после функции размытия. это имело другой контекст, когда в DOM выпадающего списка.

Смежные вопросы