用按钮制作一个 15 分钟的倒数计时器 - javascript答案

【问题标题】：Making a 15 minute countdown timer with buttons- javascript用按钮制作一个 15 分钟的倒数计时器 - javascript
【发布时间】：2017-05-23 22:23:47
【问题描述】：

我一直在 Code.org 上玩，我已经使用文本（“时钟”）和“开始”按钮成功创建了 15 分钟的倒计时。这是代码部分：

onEvent("start", "click", timing); 
function timing () {
  var countdown = 900;
var i = setInterval(function() {
  countdown = countdown - 1;
  setText("clock", countdown/60);
  if(countdown === 0) {
    clearInterval(i);
playSound("sound://default.mp3", false);
  }
}
, 1000);

它可以正常工作，只是它将第二个显示为小数（例如 15.91、15.88）而不是 15.59、15.58 等。我不知道如何更改它。创建另一个数组？我不知道。我还想添加一个我已经开始使用的休息和停止按钮：

onEvent("reset", "click", timingR);
function timingR () {
clearInterval (countdown);
}
}
onEvent("stop", "click", timingS);
function timingS () {
clearInterval (countdown);
}

但它们似乎不适用于倒计时数组。如果您有任何想法，请告诉我。谢谢。

【问题讨论】：

标签： timer setinterval countdown minute code.org

【解决方案1】：

在不重复已经回答的情况下，这可能有助于回答您的问题https://stackoverflow.com/a/5698006/8055991

如果你想更深入一点，你总是可以创建自己的计时器类，这里有一个示例 - https://github.com/shiffman/LearningProcessing/blob/master/chp18_data/example_18_09_Thread/Timer.pde

丹尼尔·希夫曼 (Daniel Shiffman) 有一个很棒的 youtube 系列，如果您刚刚开始，您会发现自己可以立即编写任何您想要的代码 :-)

【讨论】：

【解决方案2】：

您在这里有了一个良好的开端，并且您非常接近将您的代码放在您想要的位置。

首先，要正确显示时间，您必须自己构造一个字符串。您已经知道可以将countdown 除以 60 得到剩余分钟数，但您也可以使用"modulo" or "remainder" operator (%) 得到一分钟内剩余的秒数，如下所示：

var minutes = countdown / 60;
var seconds = countdown % 60;

然后您可以通过将这两个数字与":" 组合在一起来创建一个字符串，如下所示：

var display = minutes + ":" + seconds

然后设置你的时钟显示的文本像

setText("clock", display);

但是！你会注意到，如果你这样做，在你的分钟数之后你仍然会得到所有那些丑陋的小数。因此，作为最后一步，您应该使用Math.floor 将您的分钟浮点数转换为整数：

var minutes = Math.floor(countdown / 60);

所以你的最终代码看起来像

countdown = countdown - 1;
var minutes = Math.floor(countdown / 60);
var seconds = countdown % 60;
var display = minutes + ":" + seconds;
setText("clock", display);

【讨论】：