个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
28
4
我正在用 javascript 编写一个简单的倒数计时器，带有播放和暂停按钮。当我启动它时它工作正常，但如果我暂停/播放几次计时器值随机变化，我无法弄清楚为什么。
这是我的代码:
var minutesleft = 60;
var secondsleft = 0;
var millisecondsleft = 0;
var bool = true;
var paused = false;
var end;
var now;
function pause(){
paused = true;
}
function stop(){
end = now;
bool = true;
}
function cd(){
if (bool) {
end = new Date();
end.setMinutes(end.getMinutes()+minutesleft);
end.setSeconds(end.getSeconds()+secondsleft);
end.setMilliseconds(end.getMilliseconds()+millisecondsleft);
bool = false;
}
now = new Date();
diff = end - now;
diff = new Date(diff);
var msec = diff.getMilliseconds();
var sec = diff.getSeconds();
var min = diff.getMinutes();
if (min < 10){
min = "0" + min;
}
if (sec < 10){
sec = "0" + sec;
}
if(msec < 10){
msec = "00" +msec;
}
else if(msec < 100){
msec = "0" +msec;
}
if(now >= end){
clearTimeout(timerID);
document.getElementById("cdtime").innerHTML = 'POLICE IS HERE';
}
else{
document.getElementById("cdtime").innerHTML = min + ":" + sec + ":" + msec;
}
if (paused == false){
timerID = setTimeout("cd()", 10);
}
else {
bool = true;
minutesleft = min;
secondsleft = sec;
millisecondsleft = msec;
}
paused = false;
}
这是一个 fiddle :https://jsfiddle.net/cw3s5124/
提前致谢
最佳答案
跳跃数字的主要问题是由于字符串连接然后在日期函数中使用该字符串。部分代码如下:
if (min < 10){
min = "0" + min;
}
一个例子证明为什么会发生这种情况
var end1 = new Date();
var minutesleft1 = 9;
console.log("Minutes to assign to current time");
console.log(end1.getMinutes() + minutesleft1); // Logs expected amount of minutes to calculate
end1.setMinutes(end1.getMinutes() + minutesleft1);
var end2 = new Date();
var minutesleft2 = "09";
console.log("Wrong Minutes to assign to current time");
console.log(end2.getMinutes() + minutesleft2); // Logs big number
end2.setMinutes(end2.getMinutes() + minutesleft2);
console.log(end1); // Logs expected result
console.log(end2); // Logs a time a day or so in the future
■
说明:如果您要在分钟变量中将开始计时器设置为 9，则需要立即用 0 填充以显示。由于您现在将 minutesleft 变量设置为 "09"，因此您在调用 end 时实际上是在执行 9 + "09"。 setMinutes(end.getMinutes()+minutesleft);
将字符串 "0" 连接到数字后，实际上是在尝试对字符串进行数字运算，这会导致意外结果。这在开始时没有发生，因为您的 if 语句尚未运行，因此 min、sec 和 msec 变量仍然是数字。 您应该只在显示数字时填充数字，而不是计算本身。
我用从 this post 借用的填充函数替换了字符串连接.
我还添加了一个播放功能来重置您的暂停参数。这使代码更具可读性，也更容易让我理解。此外，将其更改为在开始时暂停，因为计时器尚未运行。
var minutesleft = 10;
var secondsleft = 05; // This would normally just be returned as 5, that's why we need the pad function for display
var millisecondsleft = 0;
var firstCall = true;
var paused = true;
var end;
var now;
function pause() {
paused = true;
}
function play() {
if (paused === false) // Shorcut out because we are already running
return;
paused = false;
cd();
}
function stop() {
end = now;
paused = true;
cd();
}
document.addEventListener("DOMContentLoaded", function(event) {
document.getElementById("cdtime").innerHTML = pad(minutesleft, 2) + ":" + pad(secondsleft, 2) + ":" + pad(millisecondsleft, 2);
});
function cd() {
if (firstCall) {
end = new Date();
end.setMinutes(end.getMinutes() + minutesleft);
end.setSeconds(end.getSeconds() + secondsleft);
end.setMilliseconds(end.getMilliseconds() + millisecondsleft);
firstCall = false;
}
now = new Date();
diff = end - now;
diff = new Date(diff);
var msec = diff.getMilliseconds();
var sec = diff.getSeconds();
var min = diff.getMinutes();
if (now >= end) {
clearTimeout(timerID);
document.getElementById("cdtime").innerHTML = 'POLICE IS HERE';
} else {
document.getElementById("cdtime").innerHTML = pad(min, 2) + ":" + pad(sec, 2) + ":" + pad(msec, 2);
}
if (paused === false) {
timerID = setTimeout("cd()", 10);
} else {
bool = true;
minutesleft = min;
secondsleft = sec;
millisecondsleft = msec;
}
}
function pad(n, width, z) {
z = z || '0';
n = n + '';
return n.length >= width ? n : new Array(width - n.length + 1).join(z) + n;
}<body>
<div id='timer'>
<button class='playerButtons' id='playT' type='submit' onclick='play()'>Play</button>
<button class='playerButtons' id='pauseT' type=' submit' onclick='pause()'>Pause</button>
<button class='playerButtons' id='stopT' type='submit' onclick='stop()'>Stop</button>
<div id='cdtime'></div>
</div>
</body>关于javascript - 暂停时倒数计时器javascript错误，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34183472/
28
4
0
如果我有一个变量 8589934592 示例: var a = (8589934592 | 0); //a is 0 var b = (8589934591223 | 0); //b
随着我们提高音阶，音符频率增加； #define A4 440 // These are the frequencies of the notes in herts #define A
我有一个这样组织的列表: [('down', 0.0098000000000000309), ('up', 0.0015000000000000568), ('down', 0.00890000000
如果我有一个多项式 P，有没有办法计算 P^-1 模 Q，即 Q 是另一个多项式？我知道这两个多项式的系数都属于以 z 为模的整数域，即 z 是一个整数。 我不确定 SymPy 是否已经在其 galo
对于给定的文件，我可以向后计算行数吗？即从 EOF 开始，计算行数直到开始？ 我可以 fseek 到文件末尾。从那里开始，继续寻找新行字符(新行的指示)并继续增加我的 line_number 计数。但
有什么方法可以编写带除法的 C 代码来命令编译器在代码中需要常规除法精度的几个特定位置不使用快速除法(通过倒数数学)，即使在全局允许倒数数学的情况下也是如此？ 理想情况下，有一种方法不是特定于编译器的
我正在尝试将照片从我计算机上的本地文件导入到我的 HTML 文件中。我已经设法做到了，但它是按升序排列的。我尝试添加一个变量 JavaScript $(document).ready( functio
我正在尝试使用 commons-math 计算 2 尾学生分布的逆。我正在使用 Excel 来比较值并验证结果是否正确。 所以使用excel计算TINV，自由度为5，我使用95.45% =TINV(0
我有一个 jQuery 相机插件，它使用以下命令来拍摄快照。 这是它运行的代码。 function take_snapshot() { // take snapshot and get i
我刚刚学会了训练 brain.js network 并且只是在玩它。然后我很好奇是否可以采取相反的方式 - 从输出预测输入？ 这是我的代码 const brain = require('brain.j
如果精度不重要，有什么方法可以提高速度的倒数(X 的除法 1)？ 所以，我需要计算 1/X。是否有一些解决方法让我失去精度但做得更快？ 最佳答案 𝗛𝗲𝗿𝗲𝗛𝗲𝗿𝗲𝗛𝗼𝘄𝗧𝗼?
令 N 为整数。如果N = 2536，则反转N为6352。如果N = 1000000，则反转N为1。 给定一个整数 M，其中 1 <= M <= 10^(100000)。 我们需要找到一个整数 N 是
我是一名优秀的程序员,十分优秀！