我有3个页面,一个是显示来自php页面的数据的html,以及处理数据并从数据库获取数据的php页面,最后一个是js页面。
我的问题是我在php页面中有Google地图代码,我不会在html页面中打印它。
现在我通过jquery发送它并在html页面中打开它,但它不起作用???这是为什么。
如果我从php页面复制代码并在html页面中将其过去,Google地图将会打开...那么问题出在哪里?
<style>
#map-canvas {
height: 100%;
margin: 0px;
padding: 0px
}
</style><script src='https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false'></script>
<script>
function initialize() {
var myLatlng = new google.maps.LatLng(24.701564296830245,46.76211117183027);
var mapOptions = {
zoom: 4,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title: 'Hello World!'
});
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
<div id='map-canvas'></div>
答案 0 :(得分:0)
这是“如何通过jquery将以上代码从php页面发送到html页面的示例”。
PHP(map.php):
<?php
echo "
<div id='map-canvas' style='height: 100%; margin: 0px; padding: 0px'></div>
<script src='https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false'></script>
<script>
function initialize() {
var myLatlng = new google.maps.LatLng(24.701564296830245,46.76211117183027);
var mapOptions = {
zoom: 4,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title: 'Hello World!'
});
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>";
?>
我在发布后简要地更改了上面的代码,因为我不确定浏览器如何异步解析<style>
中的<body>
。我还在div#map-canvas
之前移动了<script>
,因此在脚本执行之前HTML将会出现。
HTML页面:
<head>
<script>
$.ajax({
url: "map.php",
})
.done(function( msg ) {
$('#where_map_is_going').html(msg);
});
</script>
</head>
<body>
<div id="where_map_is_going"></div>