11.4.4 告诉玩家他们有多近

  知道了玩家单击和宝藏之间的距离,我们想要显示一个提示,告诉玩家他距离宝藏有多么近,但并不会告诉他宝藏具体有多远。为此,使用如下的getDistanceHint函数:

《javascript-少儿编程》第11章单击事件处理程序之告诉玩家他们有多近

  该函数根据计算求得的到宝藏的距离返回不同的字符串。如果距离小于10,该函数返回字符串“Boiling hot!”。如果距离在10到20之间,该函数返回”Really hot ”。随着距离的增加,字符串的热度降低,直到某一个时刻,如果距离大于320像素,该函数返回”Freezing”。

  将消息作为文本添加给Web页面的p元素,从而显示该消息。如下的代码将会放入到单击事件处理程序中,以计算距离、选取相应的字符串,并向玩家显示该字符串。

《javascript-少儿编程》第11章单击事件处理程序之告诉玩家他们有多近

  正如你所看到的,首先调用getDistanceHint,然后将结果保存为变量distance。接下来,将distance传递给getDistanceHint函数,以选取相应的字符串并将其保存为distanceHint。

  代码$(“#distance”).text(distanceHint);选取了id为” distance”的元素(在本例中,是p元素),并且将其文本设置为distanceHint,以便每次玩家单击地图的时候,Web页面都会告诉他们距离目标有多近。