谷歌地图自动完成自动选择第一个建议并在页面加载时自动提交搜索？

Question

我在我的网页上使用 Google Maps API v3，目前当页面加载时，搜索框会预先填充我选择的搜索词。 但我需要它来实际然后使用该术语搜索地图。 我似乎无法仅使用 google 的 API 找到任何方法来执行此操作，因此我想也许我可以使用以下代码模拟“输入”按键：

var e = jQuery.Event("keydown");
e.which = 13;
$("#pac-input").trigger(e);

（ #pac-input是地图上<input>标签的 id）

但是，这似乎不起作用。

那么如何在页面加载时强制搜索？

编辑：这是我正在谈论的搜索框

Answer 1

您首先要考虑的不是必须触发哪个事件，更重要的是知道何时触发事件。

预测将异步加载，因此您必须等到它们可用。 当预测可用时不会触发任何事件，但您可以观察主体的DOMNodeInserted事件（下拉列表将插入那里）并检查节点是否具有 className 'pac-item'（它是下拉列表中的项目）。

然后必须在输入上触发这些事件：

1. keydown with keyCode:40 （移动到下拉列表中的第一个预测）
2. keydown with keyCode:13 （选择/激活预测）
3. focus （激活输入）
4. keydown with keyCode:13 (发送请求)

例子：

  var input          =  document.getElementById('pac-input'),
      ac              = new google.maps.places.SearchBox(input),
      itemsloaded    =  google.maps.event
                          .addDomListener(document.body,
                                          'DOMNodeInserted',
                                          function(e){ 
                            if(e.target.className==='pac-item'){
                              //remove the listener
                              google.maps.event.removeListener(itemsloaded);
                              //trigger the events
                              google.maps.event.trigger( input, 'keydown', {keyCode:40})
                              google.maps.event.trigger( input, 'keydown', {keyCode:13})
                              google.maps.event.trigger( input, 'focus')
                              google.maps.event.trigger( input, 'keydown', {keyCode:13})
                            }
                          });

注意：在 InternetExplorer 中，从 V9 开始支持DOMNodeInserted事件，在旧版本和其他不支持此事件的浏览器中，如果文档中存在.pac-item ，您可以检查间隔。

演示： http : //jsfiddle.net/doktormolle/R8XdL/

Answer 2

如果您的用例允许，最简单的（并且大概是谷歌打算这样做的）方法是存储谷歌的 place_id，然后使用新的 google.maps.places.PlacesService.getDetails 方法基于它进行查询

var service = new google.maps.places.PlacesService(map);
service.getDetails({placeId: $('[name="google_places_id"]').val()}, function(place, status) { do code here });