Google地图 - 点击按钮触发搜索框 [英] Google Maps - Trigger Search Box on button click

问题描述

我有兴趣使用Google地图搜索按钮旁边的提交/转到按钮（例如 http://maps.google.com ）。如果我在搜索框中按Enter键，一切都会很好，但我不知道如何使用按钮强制/提交搜索。

I'm interested in implementing a Google Maps search button with a 'Submit'/'Go' button next to it (such as on http://maps.google.com). Everything works great if I press Enter in the search box, but I have no idea how to force/submit the search using the button.

现在我的代码基于在以下示例上： https://developers.google.com/maps/文档/ javascript / examples / places-searchbox 。最重要的部分是我现在正在使用它：

Right now I have my code based on the example on: https://developers.google.com/maps/documentation/javascript/examples/places-searchbox . The most important part is that I'm using this for now:

HTML：

<div id="intro-search">
    <input id="search-box" />
    <button type="button">Submit!</button>
</div>

JS：

  // Listen for the event fired when the user selects an item from the
  // pick list. Retrieve the matching places for that item.
  google.maps.event.addListener(searchBox, 'places_changed', function() {
    // ... 
    // Show the results on the map
    // ...
  }

我不知道如何在按钮点击时触发同样的事情。

I have no idea how to trigger the same thing on a button click.

在另一个说明中， SearchBox 和自动填充控件？他们不是做同样的事情吗？

On another note, what is the difference between the SearchBox and the Autocomplete controls? Don't they do the same thing?

推荐答案

对于SearchBox，您必须使用Google地图的触发事件输入字段像这样

For the SearchBox, you have to use google map's trigger event on the input field like so

document.getElementById('my-button').onclick = function () {
    var input = document.getElementById('my-input');

    google.maps.event.trigger(input, 'focus')
    google.maps.event.trigger(input, 'keydown', { keyCode: 13 });
};

这篇关于Google地图 - 点击按钮触发搜索框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！