Google地图自动搜索页面加载

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

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

#pac-input是地图上标签的id)

然而,这似乎不起作用。

那么如何强制搜索页面加载?

编辑:这是我正在谈论的搜索框 在此处输入图像描述

您必须考虑的第一件事是不必触发哪个事件,知道何时触发事件更为重要。

预测将以异步方式加载,因此您必须等到它们可用。 当预测可用时,不会触发任何事件,但您可能会观察到主体的DOMNodeInserted -event(将在那里插入下拉列表)并检查节点是否具有className’pac-item’(它是类的名称)下拉列表中的项目)。

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

  1. keydown与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 -event,在旧版本和其他不支持此事件的浏览器中,如果文档中存在.pac-item ,则可以间隔检查。

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

如果您的用例允许,最简单的(并且可能是谷歌打算)这样做的方法是存储googles 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 });