javascript - 关于JS倒计时的问题

查看:103
本文介绍了javascript - 关于JS倒计时的问题的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

问 题

倒计时的秒数显示不正常。太慢。点解。。。


<!DOCTYPE html>
<html>
  
  <head>
    <meta charset="UTF-8">
  </head>
  
  <body>
      
    <h2>毫秒的倒计时</h2>
    <div id="timer2"></div>
    <script>
      var countdown = function(gid,time){
        try {
            if (time<=0) {
            } else {

                var ms = Math.floor(time%1000);
                var s = Math.floor(time/1000%60);
                var m = Math.floor(time/1000/60%60);
                var h =Math.floor(time/1000/60/60%24);

                h=h>9?h:'0'+h;
                m=m>9?m:'0'+m;
                s=s>9?s:'0'+s;
                ms=ms>9?ms:'0'+ms;
                if (parseInt(h)>0) {
                    var str = h+':'+m+':'+s;
                } else {
                    var str = m+':'+s+':'+ms;
                }
                document.getElementById('timer2').innerHTML = str;
                setTimeout(function(){
                    countdown(gid,time-1);
                },1);
            }
        } catch (e) {
            if (typeof(console) == 'object') {
                console.log(e);
            }
        }
    };
    setTimeout(function(){countdown('timer2',99999)},1);
  
    </script>
      
      </body>
</html>

在线测试:https://jsfiddle.net/L6qvefu3/

解决方案

@Hello_World20 说的就是正确的,js里要准确计时只能用Date的时间戳
按题主的代码改了下,应该就是题主想要的效果了

<!DOCTYPE html>
<html>
  
  <head>
    <meta charset="UTF-8">
  </head>
  
  <body>
      
    <h2>毫秒的倒计时</h2>
    <div id="timer2"></div>
    <script>
      var countdown = function(gid,time,starttime){
        if (!starttime) starttime = Date.now();
        try {
            var _time = time + starttime - Date.now();
            if (_time<=0) {
                document.getElementById('timer2').innerHTML = '00:00:00';
            } else {
                var ms = Math.floor(_time%1000);
                var s = Math.floor(_time/1000%60);
                var m = Math.floor(_time/1000/60%60);
                var h = Math.floor(_time/1000/60/60%24);

                h=h>9?h:'0'+h;
                m=m>9?m:'0'+m;
                s=s>9?s:'0'+s;
                ms=ms>9?ms:'0'+ms;
                if (parseInt(h)>0) {
                    var str = h+':'+m+':'+s;
                } else {
                    var str = m+':'+s+':'+ms;
                }
                document.getElementById('timer2').innerHTML = str;
                
                
                setTimeout(function(){
                    countdown(gid, time, starttime);
                },1);
            }
        } catch (e) {
            if (typeof(console) == 'object') {
                console.log(e);
            }
        }
    };
    setTimeout(function(){countdown('timer2',99999)},1);
  
    </script>
      
      </body>
</html>

这篇关于javascript - 关于JS倒计时的问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆