4

我正在使用 Google Maps Places V3 自动完成功能。我想要一个功能，如果用户开始在搜索字段中输入内容，则会自动选择自动完成下拉列表中的第一项。

类似于 Facebook 中的搜索功能。

我已经在以下两个线程的帮助下更新了 Google 地图自动完成功能：

但我找不到这个新问题的解决方案....

我在这里发布了我的代码：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);
  });
});
4

2 回答 2

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;
});
于 2014-07-15T06:44:54.477 回答
0

试试这个代码......当你的列表打开时......

$('#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;
});
于 2013-07-18T13:51:16.647 回答