Javascript 以小时和分钟（00:00）为单位显示时间，并将秒整为分钟

我希望时间在小于10时始终显示0，例如：如果任务耗时3小时7分33秒，则显示为03:08

现在，我已经禁用按钮后，他们被点击，所以你不能重新启动计时器

下面是JS代码

let startTime;

const timer = typeof performance !== `undefined` && typeof performance.now === `function` ? performance : Date;
const startButton = document.getElementById('start');
const stopButton = document.getElementById('stop');
const display = document.getElementById('display');

startButton.onclick = () => {
    console.debug('START')
    startTime = timer.now();
  startButton.disabled = "disabled";
};

stopButton.onclick = () => {
    console.debug('STOP')
  var totalSeconds = Math.round((timer.now() - startTime) / 1000);
  var totalMinutes = Math.floor(totalSeconds / 60);
  var totalHours = Math.floor(totalSeconds / 60 / 60);
  var displaySeconds = totalSeconds - totalMinutes * 60;
  var displayMinutes = totalMinutes - totalHours * 60;
  var strDisplayTime = 
    (totalHours > 0 ? (totalHours + '0:') : '') + 
    (displayMinutes > 0 || totalHours > 00 ?
        ((displayMinutes >= 10 ? '' : '0') + displayMinutes + ':') : '00:00:') +
    ((displaySeconds >= 10 ? '' : '0') + displaySeconds)  
    display.innerHTML = strDisplayTime;
  stopButton.disabled = "disabled";
};

这是HTML

<h1>
  <!-- This shows the heading of the entire checklist -->
  Master on Call Checklist
</h1>
<ul class="checklist ng-pristine ng-untouched ng-valid ng-isolate-scope ui-sortable" ui-sortable="sortableOptions" ng-model="task">
  <li>
    <h2>
      <!-- This shows the heading of task that need to be constantly looked at -->
      <a href="#">
        Tasks that need to be constantly checked throughout the week
      </a>
    </h2>
  </li>
  <button type="button" id="start">Start Task</button>
  <p style="float:left;"></p>
  <!-- Heading to review cameras and adjest as needed -->
  <a>
    Review cameras and adjest as needed
   </a>
  <button type="button" id="stop">Finished Task</button>
  <div id="display"></div>

主待命检查表



启动任务

检查摄像机并根据需要调整
完成任务

您需要将

+（（timer.now（）-startTime）/1000>30）

添加到

totalMinutes

中，并需要计算它mod

60

您需要将

+（（timer.now（）-startTime）/1000>30）

添加到

totalMinutes

中，并需要计算它mod

60

试试这个：

var fixedDisplaySeconds = ( '0' + displaySeconds ).substr( -2 );
var fixedDisplayMinutes = ( '0' + displayMinutes ).substr( -2 );
var fixedStrDisplayTime = fixedDisplaySeconds + ':' + fixedDisplayMinutes;

基本上，总是在开头添加

'0'

，然后获取最后2个字符-如果时间是

1

，那么

'0'+1='01'

-最后2个字符是

'01'

。然后，如果时间是

11

，

'0'+11='011'

-获取最后2个字符，您将获得

'11'

，请尝试此字符：

var fixedDisplaySeconds = ( '0' + displaySeconds ).substr( -2 );
var fixedDisplayMinutes = ( '0' + displayMinutes ).substr( -2 );
var fixedStrDisplayTime = fixedDisplaySeconds + ':' + fixedDisplayMinutes;

---

基本上，总是在开头添加

'0'

，然后获取最后2个字符-如果时间是

1

，那么

'0'+1='01'

-最后2个字符是

'01'

。然后，如果时间是

11

，

'0'+11='011'

-获取最后2个字符，您将获得

'11'

，您可以直接从毫秒计数器创建日期，并使用

.getUTCHours（）

和

getUTCMinutes（）

方法将其格式化为

HH:MM

//3h07m33s（毫秒）
var ms=（3*3600+7*60+33）*1000；
//创建日期（1970年，可以）
var d=新日期（毫秒+30000）；
//将日期格式设置为HH:MM
var标准显示时间=
（'0'+d.getUTCHours（））.slice（-2）+'：'+
（'0'+d.getUTCMinutes（））.slice（-2）；
console.log（strDisplayTime）

您可以直接从毫秒计数器创建日期，并使用

.getUTCHours（）

和

getUTCMinutes（）

方法将其格式化为

HH:MM

//3h07m33s（毫秒）
var ms=（3*3600+7*60+33）*1000；
//创建日期（1970年，可以）
var d=新日期（毫秒+30000）；
//将日期格式设置为HH:MM
var标准显示时间=
（'0'+d.getUTCHours（））.slice（-2）+'：'+
（'0'+d.getUTCMinutes（））.slice（-2）；
console.log（strDisplayTime）仅供参考：
toLocaleString
的第二个参数有IE11+支持，几乎没有移动支持（只有Chrome 26+支持）。@metal03326你说得对（不过FireFox 29+也支持它）。我添加了另一种方法。仅供参考：
toLocaleString
的第二个参数支持IE11+并且几乎没有移动支持（只有Chrome 26+支持）。@metal03326你说得对（不过FireFox 29+也支持它）。我添加了另一种方法。