js以毫秒倒计时

毫秒倒计时:

<!doctype html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>

</head>

<body>
    <span id="minutesSpan"></span><span id="secondsSpan"></span><span id="mSecondsSpan"></span>毫秒

    <input type="button" value="开始" onclick="backTime()">
    <span class="J_num">71</span>
</body>

</html>


<script type="text/javascript">
    var actionTime = localStorage.getItem('saveActionTime');
    var data = new Date()
    var year = data.getFullYear();
    var month = data.getMonth() + 1;
    var day = data.getDate();
    if (actionTime) {
        var timeList = actionTime.split('-');
        var oneStatus = year > timeList[0]
        var twoStatus = (year == timeList[0]) && (month > timeList[1])
        var threeStatus = (year == timeList[0]) && (month == timeList[1]) && (day > timeList[2])
        if (oneStatus || twoStatus || threeStatus) {
            localStorage.setItem('mSeconds', 59)
            localStorage.setItem('seconds', 59)
            localStorage.setItem('minutes', 1)
            localStorage.setItem('totalNum', 71)
        }
    }

    function backTime() {
        var mSeconds = localStorage.getItem('mSeconds') || 59;
        var seconds = localStorage.getItem('seconds') || 59;
        var minutes = localStorage.getItem('minutes') || 1;

        $('.J_num').text(localStorage.getItem('totalNum') || 71)
        var myTimer;

        myTimer = setInterval(function () {
            mSeconds--;

            if (mSeconds < 0) {
                seconds--;
                if (seconds < 0) {
                    minutes--;
                    if (minutes < 0) {
                        clearInterval(myTimer);
                        return;
                    } else {
                        seconds = 59;
                        mSeconds = 99;
                    }
                } else {
                    mSeconds = 99;
                }
            }
            if (mSeconds % 200 == 1) {
                if (seconds % 2 == 1) {
                    if ($('.J_num').text() > 10 || minutes != 0) {
                        console.log(seconds)
                        $('.J_num').text($('.J_num').text() - 1);
                        console.log($('.J_num').text())
                    }
                }

            }
            localStorage.setItem('mSeconds', mSeconds)
            localStorage.setItem('seconds', seconds)
            localStorage.setItem('minutes', minutes)
            localStorage.setItem('totalNum', $('.J_num').text())
            localStorage.setItem('saveActionTime', year + '-' + month + '-' + day)

            $("#mSecondsSpan").html(mSeconds < 10 ? "0" + mSeconds : mSeconds) ;
            $("#secondsSpan").html( seconds < 10 ? "0" + seconds : seconds);
            $("#minutesSpan").html(minutes < 10 ? "0" + minutes : minutes);
        }, 10);
    }
</script>

 

posted @ 2021-01-13 09:45  前端HL  阅读(478)  评论(0编辑  收藏  举报