jQuery Mobile和Google地图不可见

好吧，所以当谈到jQuery mobile时，我是一个noobie，但是我已经湿透了。

要点是一个两页的移动网站。 第一页是一个简单的表单，用户可以选择几个选项。 提交表单后，它们将被重定向到第二页，其中包含“地图canvas”。 但出于某种原因，下一页只是空白。 有时当我按下后退按钮时，我可以看到地图但是很简单。 我很难过！

我正在使用jQuery 1.6.4和jQuery Mobile 1.0rc1。

这是我的一些代码：

第一页HTML：

 
 
 
 Start:  Current Position {% for node in nodes %} {{ node.label }} {% endfor %}  Dest:  {% for node in nodes %} {{ node.label }} {% endfor %}  Show Route <!--Show Route--> 
 
 
  

第二页（地图）HTML：

 
 
Map
 
 
 
  

相关JS：

 $(".page-map").live("pagecreate", function() { wMobile = WayFinderMobile(); if(navigator.geolocation) { navigator.geolocation.getCurrentPosition(function(position){ wMobile.initialize(position.coords.latitude, position.coords.longitude, true); }); } else { wMobile.initialize(38.94617, -92.32866); } }); 

Answer 1

看起来我的问题有两个，

一个问题是我必须为map-canvas div指定宽度和高度

此外，我必须将地图设置为在地图所在页面的“pageshow”事件中创建。

Answer 2

不确定WayFinderMobile是什么，但您是否在http://code.google.com/p/jquery-ui-map/上尝试了jquery-ui-map插件

那里也有很多很好的例子。