<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
<title>传递事件参数</title>
<style type="text/css">
*{
margin:0px;
padding:0px;
}
body, button, input, select, textarea {
font: 12px/16px Verdana, Helvetica, Arial, sans-serif;
}
p{
width:603px;
padding-top:3px;
overflow:hidden;
}
#container{
min-width:600px;
min-height:767px;
}
</style>
<script charset="utf-8" src="https://map.qq.com/api/js?v=2.exp&key=你的key"></script>
<script>
function init() {
var map = new qq.maps.Map(document.getElementById("container"),{
center: new qq.maps.LatLng(22.553147478403194, 114.049072265625),
zoom: 13
});
//添加监听事件 获取鼠标单击事件
qq.maps.event.addListener(map, 'click', function(event) {
var marker=new qq.maps.Marker({
position:event.latLng,
map:map
});
alert('您点击的位置为: [' + event.latLng.getLat() + ', ' +
event.latLng.getLng() + ']');
qq.maps.event.addListener(map, 'click', function(event) {
marker.setMap(null);
});
});
}
</script>
</head>
<body onload="init()">
<div id="container" style="width: 500px;height: 500px;margin: 0 auto;"></div>
<p>给地图绑定了点击事件，当点击地图时，会在点击位置显示Marker。</p>
</body>
</html>
网友评论