Автозаполнение Google Maps всегда выбирает первый элемент

Question

Я использую автозаполнение Google Maps Places V3. Я хотел бы иметь функциональность, где, если пользователь начинает вводить в поле поиска, автоматически выбирается первый элемент из выпадающего списка автозаполнения.

Похоже на функцию поиска в Facebook.

Я уже обновил автозаполнение карт Google с помощью этих двух тем:

• Автозаполнение Google - введите, чтобы выбрать

• Google maps Places API V3 автозаполнение - выберите первый вариант при вводе

Но я не могу найти решение этой новой проблемы....

Я разместил свой код здесь: http://jsfiddle.net/Chazz09/YfPv3/5/

$(document).ready(function(){
  var pac_input = document.getElementById('searchfield');
  // prevents enter key to submit form//    
  $('#searchfield').keydown(function (e) {
    if (e.which == 13 && $('.pac-container:visible').length) return false;
  });   
  // prevents enter key to submit form//

  (function pacSelectFirst(input){
    // store the original event binding function
    var _addEventListener = (input.addEventListener) ? input.addEventListener : input.attachEvent;

    function addEventListenerWrapper(type, listener) {
      // Simulate a 'down arrow' keypress on hitting 'return' when no pac suggestion is selected,
      // and then trigger the original listener.

      if (type == "keydown") {
        var orig_listener = listener;
        listener = function (event) {
          var suggestion_selected = $(".pac-item.pac-selected").length > 0;
          if (event.which == 13 && !suggestion_selected) {
            var simulated_downarrow = $.Event("keydown", {keyCode:40, which:40})
            orig_listener.apply(input, [simulated_downarrow]);
          }

          orig_listener.apply(input, [event]);
        };
      }

      // add the modified listener
      _addEventListener.apply(input, [type, listener]);
    }

    if (input.addEventListener)
      input.addEventListener = addEventListenerWrapper;
    else if (input.attachEvent)
      input.attachEvent = addEventListenerWrapper;

  })(pac_input);

  $(document).ready(function() 
                    {
    function initialize() {
      var options = {
        types: ['geocode'],
        componentRestrictions: {country: "fr"}
      };
      var autocomplete = new google.maps.places.Autocomplete(pac_input, options);
    }
    google.maps.event.addDomListener(window, 'load', initialize);
  });
});

Answer 1

Как насчет этого?

$("input").keypress(function(event){
            if(event.keyCode == 13 || event.keyCode == 9) {
                $(event.target).blur();
                if($(".pac-container .pac-item:first span:eq(3)").text() == "")
                    firstValue = $(".pac-container .pac-item:first .pac-item-query").text();
                else
                    firstValue = $(".pac-container .pac-item:first .pac-item-query").text() + ", " + $(".pac-container .pac-item:first span:eq(3)").text();
                event.target.value = firstValue;

            } else
                return true;
});

Answer 2

Попробуйте этот код... когда откроется ваш список..

$('#yourAddressTextBox').val($('.pac-container').find('.pac-item').eq(0).text());

Ваша функция нажатия клавиш:

$('#searchfield').keydown(function (e) {
setTimeout(function(){
    $('#searchfield').val($('.pac-container').find('.pac-item').eq(0).text());},1000);
    if (e.which == 13 && $('.pac-container:visible').length) return false;
});