js执行一次后只有刷新才可以重新执行？
要做一个百度地图全屏和退出全屏，添加了一个自定义控件，但是js执行一次后只有刷新才可以重新执行？求解！
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
body, html{width: 100%;height: 100%;overflow: hidden;margin:0;}
#allmap {width: 500px;height: 500px;overflow: hidden;margin:0;}
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak="></script>
<title>百度map全屏</title>
</head>
<body>
<div id="allmap"></div>
</body>
</html>
<script type="text/javascript">
var map = new BMap.Map("allmap");
var point = new BMap.Point(113.65, 34.76);
map.centerAndZoom(point, 15);
// 定义一个控件类,即function
function ZoomControl(){
// 默认停靠位置和偏移量
this.defaultAnchor = BMAP_ANCHOR_TOP_RIGHT;
this.defaultOffset = new BMap.Size(10, 10);
}
// 通过JavaScript的prototype属性继承于BMap.Control
ZoomControl.prototype = new BMap.Control();
// 自定义控件必须实现自己的initialize方法,并且将控件的DOM元素返回
// 在本方法中创建个div元素作为控件的容器,并将其添加到地图容器中
ZoomControl.prototype.initialize = function(map){
// 创建一个DOM元素
var div = document.createElement("div");
// 添加文字说明
div.appendChild(document.createTextNode("全屏"));
// 设置样式
div.style.cursor = "pointer";
div.style.border = "1px solid gray";
div.style.backgroundColor = "#f5f5f5";
div.style.padding = "5px";
var allmap = document.getElementById("allmap");
// 绑定事件,全屏
div.onclick = function(){
allmap.style.width = "100%";
allmap.style.height = "100%";
this.innerHTML = "退出全屏";
if(div.innerHTML == "退出全屏"){
this.onclick = function(){
allmap.style.width = "500px";
allmap.style.height = "500px";
this.innerHTML = "全屏";
};
}
};
// 添加DOM元素到地图中
map.getContainer().appendChild(div);
// 将DOM元素返回
return div;
}
// 创建控件
var myZoomCtrl = new ZoomControl();
// 添加到地图当中
map.addControl(myZoomCtrl);
</script>如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
第二个this.onclick覆盖了第一个
你都是同一个div在点击呀，click里面还有click这样写有问题的