javascript - 谷歌地图自动完成下拉列表

标签 javascript css google-maps-autocomplete

我正在使用谷歌地图自动完成功能。我有一个 div 元素,其中有一个用于搜索位置的输入元素。我得到一个可能位置的下拉列表。如何让列表位于顶部而不是显示在搜索文本字段下方(作为“下拉”列表??)。

引用:https://developers.google.com/maps/documentation/javascript/places-autocomplete#places_searchbox

最佳答案

实际上,经过数小时的反复试验后,我终于成功了!为了将来引用,如果有人有同样的问题,这里是我如何让它工作的。

列出位置的元素由 google API 赋予类名称“pac-container”。 Google API Elements for Autocomplete

因此,只需使用 CSS 即可让“pac-container”元素显示在顶部。

这是 CSS:

.pac-container
{
	position:fixed;
	display:block;
	margin-top: -210px;
}

这就是搜索现在的样子:Google Autocomplete Drop-up for Dallas Search

关于javascript - 谷歌地图自动完成下拉列表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43623589/

相关文章:

css - 为什么我的 Bootstrap 驱动的应用程序网站在 MSIE 8 中看起来如此丑陋-

css - Eclipse - 编辑 css 文件时出现烦人的错误

javascript - 更改 Google map 自动完成字段的值

angular - google maps places autocomplete addEventListener 不起作用

javascript - node.js、express.js 和 mysql - 无法读取未定义的属性 'status'

javascript - 什么时候应该在 Angular 中使用 $scope.apply() ?

javascript - 如何根据用户输入在数组中查找值

CSS:包含 Bootstrap 时宽度行为发生变化

javascript - 如何在 Vue + Axios 中使用 List.JS?

javascript - Google map api 自动完成 - 获取一个城市(或几个城市)的位置