Question

// Set the date we're counting down to
var countDownDate = new Date();
countDownDate.setTime(countDownDate.getTime() + (30 * 60 * 1000));

// Update the count down every 1 second
var x = setInterval(function() {

  // Get todays date and time
  var now = new Date().getTime();

  // Find the distance between now and the count down date
  var distance = countDownDate - now;

  // Time calculations for days, hours, minutes and seconds
  var minutes = Math.floor((distance/1000/60)%60);
  var seconds = Math.floor((distance /1000) % 60);

  // Output the result in an element with id="demo"
  document.getElementById("demo").innerHTML =  minutes + "m " + seconds + "s ";

  // If the count down is over, write some text 
  if (distance < 0) {
    clearInterval(x);
    document.getElementById("demo").innerHTML = "EXPIRED";
  }
}, 1000);

<!DOCTYPE HTML>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
p {
  text-align: center;
  font-size: 60px;
  margin-top: 0px;
}
</style>
</head>
<body>

<p id="demo"></p>

</body>
</html>

我想要以分钟为单位的2个数字和以秒为单位的2个数字的输出，例如09:06

我尝试了slice（-2），但无法正常工作，所以我想知道其他尝试的方法

我对js和这个东西非常了解

Answer 1

只需检查它是否小于10，如果是，则添加前导0：

var minutes = (Math.floor((distance/1000/60)%60)<10?'0':'') + Math.floor((distance/1000/60)%60);
var seconds = (Math.floor((distance /1000) % 60)<10?'0':'') + Math.floor((distance /1000) % 60);

Answer 2

有几种方法可以做到这一点。

检查数字是否小于10，如果小于10，则添加0

function checkTime(num){
    if(num<10){
        return "0"+num
    }
        return num
    }

Answer 3

<body>
    <div>Expires In <span id="time">05:00</span> minutes!</div>
</body>
<script>
function startTimer(duration, display) {
    var timer = duration, minutes, seconds;
    setInterval(function () {
        minutes = parseInt(timer / 60, 10)
        seconds = parseInt(timer % 60, 10);

        minutes = minutes < 10 ? "0" + minutes : minutes;
        seconds = seconds < 10 ? "0" + seconds : seconds;

        display.textContent = minutes + ":" + seconds;

        if (--timer < 0) {
            timer = duration;
        }
    }, 1000);
}

window.onload = function () {
    var fiveMinutes = 60 * 5,
        display = document.querySelector('#time');
    startTimer(fiveMinutes, display);
};
</script>

Answer 4

// Set the date we're counting down to
var countDownDate = new Date();
countDownDate.setTime(countDownDate.getTime() + (30 * 60 * 1000));
// Update the count down every 1 second
var x = setInterval(function() {
  // Get todays date and time
  var now = new Date().getTime();
  // Find the distance between now and the count down date
  var distance = countDownDate - now;
  // Time calculations for days, hours, minutes and seconds
  var minutes = Math.floor((distance/1000/60)%60);
  var seconds = Math.floor((distance /1000) % 60);
  // Output the result in an element with id="demo"\
  if (minutes.toString().length == 1)minutes= "0" + minutes;
  if (seconds.toString().length == 1)seconds= "0" + seconds; 
 document.getElementById("demo").innerHTML = minutes+":"+seconds;
  // If the count down is over, write some text 
  if (distance < 0) {
    clearInterval(x);
    document.getElementById("demo").innerHTML = "EXPIRED";
  }
}, 1000);

<!DOCTYPE HTML>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
p {
  text-align: center;
  font-size: 60px;
  margin-top: 0px;
}
</style>
</head>
<body>

<p id="demo"></p>



</body>
</html>

Answer 5

<!DOCTYPE HTML>
<html>

<head>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <style>
    p {
      text-align: center;
      font-size: 60px;
      margin-top: 0px;
    }
  </style>
</head>

<body>

  <p id="demo"></p>

  <script>
    // Set the date we're counting down to
    var countDownDate = new Date();
    countDownDate.setTime(countDownDate.getTime() + (30 * 60 * 1000));

    // Update the count down every 1 second
    var x = setInterval(function() {

      // Get todays date and time
      var now = new Date().getTime();

      // Find the distance between now and the count down date
      var distance = countDownDate - now;

      // Time calculations for days, hours, minutes and seconds
      var minutes = Math.floor((distance / 1000 / 60) % 60);
      var seconds = Math.floor((distance / 1000) % 60);

      // Output the result in an element with id="demo"
      document.getElementById("demo").innerHTML = ("0" + minutes).slice(-2) + "m " + ("0" + seconds).slice(-2) + "s ";

      // If the count down is over, write some text 
      if (distance < 0) {
        clearInterval(x);
        document.getElementById("demo").innerHTML = "EXPIRED";
      }
    }, 1);
  </script>

</body>

</html>

在代码中替换以下行

document.getElementById("demo").innerHTML =  minutes + "m " + seconds + "s ";

与

document.getElementById("demo").innerHTML =  ("0" + minutes).slice(-2) + "m " + ("0" + seconds).slice(-2) + "s ";

说明：

在代码中，您需要在每个数字前添加“ 0”，并在返回的最后两个字符处加上slice（-2）。这样，JavaScript会在每个一位数字前添加前导零，而保留两位数字不变。

例如：

（“ 05”）。slice（-2）=“ 05”;

（“ 018”）。slice（-2）=“ 18”;

我希望输出的分钟和秒像是09:09

5 个答案: