我尝试将毫秒放到我的计时器上,但它们的作用就像秒而不是毫秒。他们已经过了几秒钟。但是没有表现得像毫秒。此外,我一直试图让百分比看到倒计时有多远。那么我该如何解决这个问题?
这是与整个脚本的链接:http://embed.plnkr.co/hUeAAzBBszAnCq7FdeGO/
// Code goes here
window.addEventListener('load', start);
function start() {
countdown();
}
function isNumberKey(evt) {
var charCode = (evt.which) ? evt.which : event.keyCode;
if (charCode > 31 && (charCode < 48 || charCode > 57))
//if charcode is keycode more then 31 and keycode less then 48 and more then 57 return false
{
return false;
//aren't numbers
} else {
return true;
//only can type numbers
}
}
function countdown(val) {
var counter = parseInt(val);
var myVar = setInterval(function() {
if (counter >= 0) {
document.getElementById("timer").innerHTML = Math.floor(counter / 60) + ":" + ("0" + Math.floor(counter) % 60).slice(-2) + "." + Math.floor((counter % 1000) * 1000) / 1000;
//counter/60 calculates the minute and counter%60 calculates the seconds.
counter--;
}
if (counter < 0) {
document.getElementById("timer").innerHTML = "That was the countdown";
}
}, 1000)
}
var stop = 0;
function decrease() {
var percent = Number($('#counter span').text());
if (percent > stop) {
$('#counter span').text(--percent);
var t = setTimeout(decrease, 1000);
}
}
setTimeout(decrease, 1000);
function count() {
var input = document.getElementById("number_input").value;
countdown(input);
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
only numbers please :
<input type="text" placeholder="type in a number" id="number_input" onkeypress="return isNumberKey(event)" />
<button onclick="count()">tel af</button>
<p id="timer">0</p>
<div id="counter">
<p><span>100</span>%</p>
</div>
&#13;
答案 0 :(得分:0)
您的超时设置错误,每1秒设置一次,导致问题。
1000 = 1秒 100 = 100毫秒......现在根据需要进行调整
您需要隔离管理计数器的方式或不同地更改HTML更改逻辑
答案 1 :(得分:0)
您在超时和间隔中使用1000。该数字以毫秒为单位。你必须做一些数学计算才能同时倒数秒和毫秒。
与您的问题无关:您正在使用JQuery和getElementById。为什么不改变
document.getElementById("timer").innerHTML
进入
$("#timer").html(...)