题目：
- 创建一个Web页面，它带有一幅图像，以及向玩家展示消息的地方
- 在地图上选取一个随机的点来埋宝藏
- 创建一个单机事件处理程序。每次玩家单机地图，这个单击事件处理程序都会做如下事情：
a.将单击计数加1，并显示剩余次数
b.计算单击位置距离宝藏位置有多远
c.在Web页面上显示一条消息，告诉玩家离宝藏的距离
d.如果玩家在宝藏上单击的点距离宝藏很近，恭喜玩家并显示他们用了多少次单击找到宝藏
<body>
<img id="map" src="image/Img388582882.jpg" alt="藏宝图">
<p>本游戏一共10次机会</p>
<p id="clicks"></p>
<p id="distance"></p>
<script src="https://code.jquery.com/jquery-2.1.0.js"></script>
<script>
var height = 301;
var width = 550;
var clicks = 0;
//随机函数
function getrandomNumber(size) {
return Math.floor(Math.random()*size);
}
//生成宝藏点
var target = {
x : getrandomNumber(width),
y : getrandomNumber(height)
};
//console.log(target);
//计算单击点和目标点之间的距离
function getdistance(event, target) {
var diffX = event.offsetX - target.x;
var diffY = event.offsetY - target.y;
//console.log(Math.sqrt(diffX * diffX + diffY * diffY));
return Math.sqrt(diffX * diffX + diffY * diffY);
}
//向玩家展示距离目标还有多远
function getDistanceHint(distance) {
if(distance < 8) return alert("恭喜找到宝藏" + clicks);
if(distance < 10) return"还差一点";
else if(distance < 20) return"很近";
else if(distance < 40) return"近";
else if(distance < 80) return"远";
else if(distance < 160) return"很远";
else if(distance < 320) return"非常远";
else return"差的十万八千里";
}
//寻宝事件
$("#map").click(function (event) {
var limit = 1 + clicks++;
if(clicks >= 0){
var distance = getdistance(event,target);
var distanceHint = getDistanceHint(distance);
$("#distance").text(distanceHint);
$("#clicks").text("次数： " + limit);
}
if(clicks > 10){alert("game over");}
});
</script>
</body>bug：游戏结束后无法停止，还能继续寻宝。
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用。你还可以使用@来通知其他用户。