个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
我正在尝试使用 JavaScript 制作一个秒表。我有日期来填充正确的信息，但我的秒表不工作。我单击开始，数字永远不会从 0 移动，我想让它在 MS 中立即递增。我也有 JS 和 HTML 的代码。 HTML 正常运行，但 JS 却没有。我对 JavaScript 世界非常陌生，我看了又看，但无法找到对我有益的解决方案。感谢你的协助。
"use strict";
var $ = function(id) { return document.getElementById(id); };
var stopwatchTimer;
var elapsedMinutes = 0;
var elapsedSeconds = 0;
var elapsedMilliseconds = 0;
var displayCurrentTime = function() {
var now = new Date();
var hours = now.getHours();
var ampm = "AM";
if (hours > 12) {
hours = hours - 12;
ampm = "PM";
} else {
switch (hours) {
case 12:
ampm = "PM";
break;
case 0:
hours = 12;
ampm = "AM";
}
}
$("hours").firstChild.nodeValue = hours;
$("minutes").firstChild.nodeValue = padSingleDigit(now.getMinutes());
$("seconds").firstChild.nodeValue = padSingleDigit(now.getSeconds());
$("ampm").firstChild.nodeValue = ampm;
};
var padSingleDigit = function(num) {
if (num < 10) { return "0" + num; }
else { return num; }
};
var tickStopwatch = function() {
// I also need to increment in 10 milliseconds increments but unsure if I //have this right
var ms=0;
var sec=0;
var min=0;
var frame= function() {
If(ms==1000)
ms=0;
sec++;
}
if(sec==60) {
sec=0;
min++;
document.getElementById("s_seconds").innerHTML = valueOf(sec);
document.getElementById("s_minutes").innerHTML = valueOf(min);
document.getElementById("s_ms").innerHTML = valueOf(ms);
}
};
var startStopwatch = function(evt) {
};
var stopStopwatch = function(evt) {
};
var resetStopwatch = function(evt) {
};
window.onload = function() {
displayCurrentTime();
setInterval(tickStopwatch, 1000);
};
"use strict"; //evt is in a separate file
var evt = {
attach: function(node, eventName, func) {
},
detach: function(node, eventName, func) {
},
preventDefault: function(e) {
}
};
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Clock</title>
<link rel="stylesheet" href="clock.css">
<script src="library_event.js"></script>
<script src="clock.js"></script>
</head>
<body>
<main>
<h1>Digital clock with stopwatch</h1>
<fieldset>
<legend>Clock</legend>
<span id="hours"> </span>:
<span id="minutes"> </span>:
<span id="seconds"> </span>
<span id="ampm"> </span>
</fieldset>
<fieldset>
<legend>Stop Watch</legend>
<a href="#" id="start">Start</a>
<a href="#" id="stop">Stop</a>
<a href="#" id="reset">Reset</a>
<span id="s_minutes">00</span>:
<span id="s_seconds">00</span>:
<span id="s_ms">000</span>
</fieldset>
</main>
</body>
</html>
最佳答案
如果您增量更新值 ms、seconds、minutes，您将永远不会准确。每次更新都会浪费时间。在 JS 中根本没有可以以那种速度和精度运行的区间。
相反，从内部时钟计算它们
let offset = 0,
paused = true;
render();
function startStopwatch(evt) {
if (paused) {
paused = false;
offset -= Date.now();
render();
}
}
function stopStopwatch(evt) {
if (!paused) {
paused = true;
offset += Date.now();
}
}
function resetStopwatch(evt) {
if (paused) {
offset = 0;
render();
} else {
offset = -Date.now();
}
}
function format(value, scale, modulo, padding) {
value = Math.floor(value / scale) % modulo;
return value.toString().padStart(padding, 0);
}
function render() {
var value = paused ? offset : Date.now() + offset;
document.querySelector('#s_ms').textContent = format(value, 1, 1000, 3);
document.querySelector('#s_seconds').textContent = format(value, 1000, 60, 2);
document.querySelector('#s_minutes').textContent = format(value, 60000, 60, 2);
if(!paused) {
requestAnimationFrame(render);
}
}<fieldset>
<legend>Stop Watch</legend>
<a href="#" id="start" onclick="startStopwatch()">Start</a>
<a href="#" id="stop" onclick="stopStopwatch()">Stop</a>
<a href="#" id="reset" onclick="resetStopwatch()">Reset</a>
<span id="s_minutes">00</span>:
<span id="s_seconds">00</span>:
<span id="s_ms">000</span>
</fieldset>offset 存储两个值:当 paused 时，它存储您停止时的值，否则它存储您必须添加到 Date.now( ) 计算值。
该值是以毫秒为单位的时间，计算秒和分钟是基本算术。
关于以毫秒为增量的 Javascript 秒表，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/53000446/
25
4
0
我正在学习如何开发，我正在尝试使用 Javascript 为我的 html 正文实现秒表 var c = 0.0; function tempo() { document.getElementBy
我正在尝试使用 JavaScript 制作一个秒表。我有日期来填充正确的信息，但我的秒表不工作。我单击开始，数字永远不会从 0 移动，我想让它在 MS 中立即递增。我也有 JS 和 HTML 的代码。
我正在制作一个简单的秒表。我面临的问题是当我再次开始时从上次停止的地方开始/恢复秒表。我试图保留耗时的值，但没有运气 演示= import UIKit class ViewController: UI
我一直在尝试使用 JavaScript 创建一个简单的秒表脚本，以显示已经过去的秒数、分钟数和小时数。 理想情况下，我希望时间显示如下: hh:mm:ss 使用 JavaScript，我无法找到一种内
大家好，我最近开始学习 React，但遇到了一些问题。我正在尝试制作简单的 react 应用程序，我正在制作的组件之一是秒表。现在，我在使用从父组件传递给秒表组件的 Prop 时遇到问题。这是我的应用
我有一个代码可以正常工作，但我认为如果我继续遵循相同的策略来做所有相同的事情，它会无缘无故地在处理器上过载 我有一个代表时间的变量，这个变量在游戏对象的速度高于 0.5f 的每一帧中都为 0，所以我不
我想创建一个跟踪任务时间的 ASP.NET WinForms 应用程序。我需要能够编写表单，以便将任务添加到数据库、在新选项卡中打开它，以及能够开始、暂停和停止任务。完成后，我需要计算完成任务所需的时
我正在使用我在此处找到的 stopwatch 代码: http://www.kellishaver.com/projects/stopwatch/ (function($) { $.fn.st
本文实例讲述了java实现的计时器【秒表】功能。分享给大家供大家参考，具体如下： 应用名称：java计时器 用到的知识：java gui编程 开发环境：win8+eclipse+jdk1.8
众所周知秒表 在将在所有内核上运行的多线程异步应用程序中可能存在问题。 On a multiprocessor computer, it does not matter which processor
我想知道测量 C++ 中某些代码的执行时间的最佳方法是什么。是否有内置的秒表(.Net)类似类？我正在VS2010上开发C++。我如何(如果)在我的 C++ 项目中使用 .Net 库？先感谢您。 最佳
我已经实现了一个 SIP Servlet，其中我从客户端接收两种类型的消息。我可以接收高优先级消息和低优先级消息，当我读取消息的 URI 时，我将其分开，如下面的代码所示。我必须实现一个基本的秒表，它
我使用pyqt库在python中制作了一个秒表(chronometre)，但是当我按下重置按钮然后按下开始按钮时遇到问题，我看到时间增加了两倍，然后重复我看到增加的过程三人一组等等。 我不明白为什么会
我在 jQuery 中发现了这个有用的 JS，用于具有小时、分钟和秒的秒表。 http://daokun.webs.com/jquery.stopwatch.js 问题是，小时计数器对我来说毫无用处，
我想从我的应用程序启动 android 附带的秒表应用程序，但不知道如何执行此操作。我不想自己创建秒表，因为它需要在我关闭我的应用程序时继续运行。 最佳答案 在 Android 4.1(或可能是 4.
我正在开发一个简单的秒表，问题是当用户按下主页按钮时，线程女巫计算时间卡住我如何避免让线程在后台运行？ 最佳答案 一个更简单的解决方案是使用 system.currentTimeMillis 记录秒表
我这里有秒表所需的代码。我想要的只是摆脱这里的 Swing 部分并在控制台中显示相同的输出。有人可以帮忙吗？ import java.awt.event.*; import javax.swing.*
我正在编写一个用于计时的秒表应用程序，我需要检查时钟是否超过某个时间间隔(例如 20:00 - 06:00)，在这种情况下，将当前耗时添加到我设置的 TimeInterval 变量中稍后将存储在数据库
我正在使用 NSTimer 制作秒表。如果用户切换到不同的应用程序，我希望它继续工作，但现在它只在应用程序运行时工作。我认为通过在计时器启动时记录时间戳来解决这个问题可能非常简单，但我不确定如何将其与
我正在尝试制作一个简单的 Java 应用程序来计算时间，并能够停止和启动计时器。但是，标签不会更新，当我按下开始时，它会卡住。 你能帮我找出问题所在吗？ package random; import
我是一名优秀的程序员,十分优秀！