Google 地点自动完成插件在 Firefox 中不工作 android

Google Places Autocomplete plugin isnt working in Firefox android

我们在我们的网站上使用 google 的 places-autocomplete 插件。

最近,我们收到了网站访问者的多起投诉,称此插件无法在 Android 版本的 Firefox 中运行。不过,它在桌面版 Firefox 中运行良好。

问题可以通过

简单观察
  1. 前往地点自动完成示例here
  2. 正在尝试在 "Enter a location" 搜索输入中输入邮政编码

您将观察到以下 2 个问题 -

  1. Google 自动完成应该在您开始输入时显示建议 邮政编码。但直到有人在 5 位邮政编码后键入 space, 时才会出现。
  2. 当建议确实出现时(在键入 space 之后),您无法选择第一个建议。当您点击它时,光标会移回搜索输入。但是您可以正确选择第二个或第三个建议。

问题 #2 对用户来说非常烦人和沮丧。我们已经收到多起关于此的投诉。

我已经在 Samsung S4 运行 Android 4.4.2 上的 Firefox 版本 36.0.2 上确认了这一点。

如何解决?

解决第二个问题的方法是为第一个自动完成建议提供上边距,以便用户可以单击它。它不漂亮但很实用。

css

.FirefoxAndroid .pac-container .pac-item:first-child { 
    margin-top: 20px;
}

js

<script> 
    var is_firefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1;     
    var is_android = navigator.userAgent.toLowerCase().indexOf('android') > -1; 

    if(is_firefox && is_android){ 
        $('html').addClass('FirefoxAndroid');
    }
</script>

我今天遇到了同样的问题 - 我正在工作的网站在每个网络浏览器上都能完美运行,自动完成功能也很好,但在 FF 移动版上除外。

在尝试了 3-4 种解决方案后,对我有用的解决方案是在我的代码顶部声明 var place

我有类似的东西

var autocomplete;
var place;
var input = document.getElementById('location');
var options = {
    componentRestrictions: {'country':'be'},
    types: ['(regions)'] // (cities)
};

autocomplete = new google.maps.places.Autocomplete(input,options);
google.maps.event.addListener(autocomplete, 'place_changed', function () {
    place = autocomplete.getPlace();
    ...
}

因为我没有在顶部声明 place,所以它不能只在 FF 移动设备上工作。

说不定会对以后知道的人有所帮助