javascript - 在我的评分脚本中添加倒计时 (javascript/jquery)

Question

我在 js 文件中有以下脚本:

// Ad score
var score = 0;
//$('#score').text(score);
function foundMatchingBlocks(event, params) {
      params.elements.remove();
      score += 100;
      $('#score').text(score);
};

现在，在每次匹配时，var 分数都会增加 100 分。这一切都有效。现在我想稍微扩展一下。页面加载后，我想开始倒计时，以每秒 1 点减少点数(从 100 开始)，持续 60 秒。所以一个用户可以获得的最低点数是40。当有人获得点数时，计数器应该重新设置并重新倒计时。

示例:

1. 页面加载(计时器从 100 开始)
2. 用户在 10 秒后匹配(添加 +90 分)
3. 计数器重置并再次从 100 开始倒计时
4. 用户在 35 秒后找到匹配项(添加 +65 分)
5. 等等等等

问题是，我不知道该怎么做:(希望有人能帮我解决这个问题。

以上已修复，感谢大家的帮助!!!

Answer 1

总的来说，您需要非常熟悉 javascript 中的超时和间隔。这是我在需要刷新内存时不断返回的引用页面:http://www.elated.com/articles/javascript-timers-with-settimeout-and-setinterval/

对于您的特定任务，您可能希望使用每 1000 毫秒触发一次的间隔来计算逐秒减少的分数，以及一个单独的失败超时，该超时会在用户每次完成挑战时重置。

这里有一些处理通常会导致后续问题的超时和间隔的技巧:

设置超时时，始终捕获返回值(我认为它基本上是一个随机整数)。为方便起见，将其保存到一些全局变量中。

var failureTimer; // global var high up in your scope

failureTimer = setTimeout ( "gameOver()", 100000 ); // 100 seconds * 1000ms

然后无论在玩家完成挑战时调用哪个方法，您都可以调用它:

clearTimeout (failureTimer); // resets the timer and gives them another 100 seconds

failureTimer = setTimeout ( "gameOver()", 100000 ); // yes call this again, to start the 100 sec countdown all over again.

在使用超时和间隔时，您可能遇到的第二个痛点是如何将参数传递给上面示例中的 gameOver() 等函数。您必须使用匿名函数，如下所述:

Pass parameters in setInterval function

有关匿名函数的更多信息，这是一个很好的概述:

http://helephant.com/2008/08/23/javascript-anonymous-functions/

祝你的项目好运!如果您有任何问题，请告诉我。