我只是想在jquery移动页面中显示谷歌地图.如果我直接加载页面就可以了.但是,如果我从另一个页面导航到该页面,它只渲染一个地图图块.乍一看,似乎我的问题类似于https://forum.jquery.com/topic/google-maps-inside-jquery-mobile
但是,我已经在'pageinit'事件中执行了初始化,我的map div有一个设置的宽度和高度.
我见过http://code.google.com/p/jquery-ui-map/,但如果可能的话,我宁愿不使用(另一个)第三方插件.
这是我的页面的样子:
<!DOCTYPE HTML>
<html>
<head>
<title>PhoneGap</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="cordova-1.6.1.js"></script>
<link rel="stylesheet" href="jquery.mobile-1.1.0.min.css" />
<script src="jquery-1.7.1.min.js"></script>
<script src="global.js"></script>
<script src="jquery.mobile-1.1.0.min.js"></script>
</head>
<body>
<div id="mapPage" data-role="page">
<style type="text/css">
html
{
height: 100%;
}
body
{
height: 100%;
margin: 0;
padding: 0;
}
#map_canvas
{
height: 100%;
}
</style>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=***API_KEY_REMOVED***&sensor=true">
</script>
<script type="text/javascript">
function initialize() {
var height = $(window).height() - 50;
var width = $(window).width();
$("#map_canvas").height(height);
$("#map_canvas").width(width);
var myLatlng = …