jQuery和谷歌地圖

我一直使用此代碼顯示在jQuery Mobile的頁面顯示事件谷歌地圖，但它不工作..jQuery和谷歌地圖

$('#page3').live('pageshow', function(event, ui) { 
    $('#googleMap').gmap().bind('init', function(ev, map) { 
     $('#googleMap').gmap('addMarker', {'position': '57.7973333,12.0502107', 'bounds': 
true}).click(function() { 
       $('#googleMap').gmap('openInfoWindow', {'content': 'Hello World!'}, this); 
        }); 
      }); 
    });

來源

2012-12-20 h_a86

什麼'pageshow'事件的詳細信息？它來自jQuery Mobile嗎？ – wakooka

是來自jquery mobile。 –

我認爲這個解決方案解決您的問題：

你map.html

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>Map</title> 
<script> 
    function initialize() { 
     var myLatlng = new google.maps.LatLng(51.520838, -0.140261); 
     var myOptions = { 
      zoom: 15, 
      center: myLatlng, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     } 
     var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 
    } 
</script> 
<script src="http://maps.google.com/maps/api/js?sensor=false"></script> 
<style> 
    html { 
     height: 100%; 
     overflow: hidden; 
    } 
    body { 
     margin: 0; 
     padding: 0; 
     height: 100%; 
    } 
    #map_canvas { 
     height: 100%; 
    }  
</style> 
</head> 
<body onload="initialize()"> 
    <div id="map_canvas"></div> 
</body> 
</html>

你的按鈕，打開map.html

<div data-role="popup" id="popupMap" data-overlay-theme="a" data-theme="a" data-corners="false" data-tolerance="15,15"> 
    <a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a> 
    <iframe src="map.html" width="480" height="320" seamless></iframe> 
</div>

查看jQuery Mobile - Popup iframes

來源

2012-12-20 11:21:04

jQuery和谷歌地圖

回答

相關問題