前端學習(1632):前端系列實戰課程之定時器

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

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        window.onload = function() {
                var Ot = document.getElementById('time');
                var Os = document.getElementById('start');
                var Oe = document.getElementById('end');

                var timer = null;

                function toDou(n) {
                    if (n < 10) {
                        return '0' + n;
                    } else {
                        return '' + n;
                    }
                }
                Os.onclick = function() {
                    var s = 0;
                    clearInterval(timer);
                    timer = setInterval(function() {
                        s++;
                        Ot.value = parseInt(toDou(s / 60)) + ':' + toDou(s % 60);
                    }, 500)
                }
                Oe.onclick = function() {

                    clearInterval(timer);

                }
            }
            /*  定時器 
            setInterval(function(){
                console.log(1);
            },1000) */
    </script>
</head>

<body>
    <input type="text" value="00:00" id="time">
    <input type="button" value="開始" id="start">
    <input type="button" value="結束" id="end">
</body>

</html>

運行結果

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章