Phonegap:谷歌地图的SearchBox / Autocomplete不适用于iOS / Mobile

时间:2013-07-09 22:49:51

标签: jquery google-maps google-maps-api-3 cordova phonegap-build

我正在使用谷歌地图APIv3,jQuery 1.9.1,JQuery Mobile 1.3.1和Phonegap 2.9.0,并使我的代码变得小巧:http://jsfiddle.net/vkpWK/我相信这些内容肯定会发生一些变化3行代码:

// Assign Search Box
input = /** @type {HTMLInputElement} */ (document.getElementById('searchTextField')),
searchBox = new google.maps.places.SearchBox(input);

// Event Listener - Move the Map on Search Results
google.maps.event.addListener(searchBox, 'places_changed', function () {

在Phonegap中,此代码有效,但是当您看到SearchBox的下拉列表中的建议时,您无法单击它们。点击它们什么都不做。我正在寻找一种方法让点击建议实际上触发'places_changed'事件。

为了使事情变得复杂,这里是踢球者。这段代码有效。它在桌面和iOS / Android上都可以正常工作。您可以单击搜索结果并按预期工作,地图将更新到新搜索的位置。但是,它在Phonegap中对我不起作用。我有一种不好的感觉,这在某种程度上是一个CSS问题,或者其他一些JS监听器不允许这种情况发生。我该如何测试这个理论?

作为替代方案,我已经使用google.maps.places.Autocomplete测试而不是google.maps.places.SearchBox,但它没有帮助。

谢谢!

1 个答案:

答案 0 :(得分:-1)

我在index.html's <head>

中添加此功能后,我已将其设为正常工作
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script> 

此外,如果您能够看到非常小的字体和用户界面,请尝试替换此<meta>

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, target-densitydpi=medium-dpi, user-scalable=0" />