绑定谷歌地方自动完成文本框没有实例化谷歌地图 [英] bind google places autocomplete on textbox without instantiating a google map
问题描述
我正在尝试在我的网站上添加Google商家信息自动填充功能。我在使用Autocomplete绑定我的搜索文本框时遇到问题，无需使用实例化Google地图。我想要做的是，我想在自己的搜索字段中使用自动填充作为文本建议。但令人遗憾的是，我所见过的所有教程都与谷歌地图一起使用自动完成。有没有什么办法解决这个问题？
I'm trying to add Google Places Autocomplete on my Website. I'm having a problem with binding my search textbox with Autocomplete without the use of instantiating a google map. What I'm trying to do is, I want to use the autocomplete as a text suggestion on my search field. but sadly, all the tutorials I've seen had autcomplete being used along with a google map. Is there any way around this?
在此先感谢您。
Thanks in advance.
推荐答案
你可以使用下面的代码。
Guys you can use following code.
<!DOCTYPE html>
<html>
<head>
<link type="text/css" rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500">
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=places"></script>
<script>
var autocomplete;
function initialize() {
autocomplete = new google.maps.places.Autocomplete(
/** @type {HTMLInputElement} */(document.getElementById('autocomplete')),
{ types: ['geocode'] });
google.maps.event.addListener(autocomplete, 'place_changed', function() {
});
}
</script>
</head>
<body onload="initialize()">
<div id="locationField">
<input id="autocomplete" placeholder="Enter your address" onFocus="geolocate()" type="text"></input>
</div>
</body>
</html>
编辑：Google地图现在需要 API键以便使用。
Google Maps now require an API key for this to work.
这篇关于绑定谷歌地方自动完成文本框没有实例化谷歌地图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
