Jquery 地图外的谷歌地图搜索框

我正在玩谷歌地图API，我插入了一个带有自动完成功能的搜索表单。问题是输入框卡在了地图上。我不能在地图外显示它

<div style=" margin-top:100px;background: #00a6d6; width: 100%; height:100px;"><input id="address" style="position:absolute; left:1000px;"  type="text"
        placeholder="Enter a location"></div>

<div>
<div id="map-canvas" style="height:500px; width:500px;"></div></div>

看这里。我希望搜索框位于蓝色容器中

---

谢谢。

您只需在此处加载Places库即可。你甚至不需要显示地图

new google.maps.places.Autocomplete(
（document.getElementById（'autocomplete'））{
类型：['geocode']
});
#自动完成{
宽度：300px；
}
基本上，如果我理解得很好，您希望使用autocomplete来更新谷歌地图。但是你想让它在地图之外

这一行将您的输入绑定到地图。你不需要它

map.controls[google.maps.ControlPosition.TOP_LEFT].push(input);

然后从输入中删除
left:1000px
，就这样了

如果你不想让它“粘”在地图上，就不要将其设为控件@但是，我不能使用自动完成？你为什么这么说？您也可以查看：查看演示：-通过将模块集成到web表单中，用户可以轻松地选择地址，您可以轻松地收集准确的地址详细信息。这是正确的答案。MrUpsidown的一个实际上是指“autocomplete”api调用，而不是“searchbox”。有一个显著的区别——“问题是输入框卡在地图上。我不能在地图外显示它。”这就是我读到的问题。我认为这个答案正是他想要的。我投票赞成这个答案。谢谢你简洁的回答。搜索结果的回调在哪里？