停止的定时器无法恢复

#想实现跳动显示当天时间,且点击按钮可停止时间5秒,期间不能点击按钮,5秒后时间跳动恢复。写了代码后发现时间恢复这一步没有实现,好像停止定时器的原理是是停止setInterval(调用函数,延迟的毫秒数)代码一样的定时器,之后再写一样的不起作用。请问要怎么改才能实现预想的功能呢?

<span id="dianjiww"></span>
<span id="dianjiwww"></span>
<button id="dianjiwwww">停止时钟5秒</button>
<script>
    var dianjiw = document.getElementById('dianjiw')
    var dianjiww = document.getElementById('dianjiww')
    var dianjiwww = document.getElementById('dianjiwww')
    var dianjiwwww = document.getElementById('dianjiwwww')
    var dianjiwwwwtime = 4

    function dianjiwtimer() {
        var dianjiwtime = ((+new Date()) / 1000) % (60 * 60 * 24)
        dianjiw.innerHTML = (parseInt(dianjiwtime / 60 / 60) + 8) % 24
        dianjiw.innerHTML = dianjiw.innerHTML < 10 ? '0' + dianjiw.innerHTML + ':' : dianjiw.innerHTML + ':'
        dianjiww.innerHTML = parseInt(dianjiwtime / 60 % 60)
        dianjiww.innerHTML = dianjiww.innerHTML < 10 ? '0' + dianjiww.innerHTML + ':' : dianjiww.innerHTML + ':'
        dianjiwww.innerHTML = parseInt(dianjiwtime % 60)
        dianjiwww.innerHTML = dianjiwww.innerHTML < 10 ? '0' + dianjiwww.innerHTML : dianjiwww.innerHTML
    }
    dianjiwtimer() //事先调用一次,防止定时调用前的空白
    var dianjiwtimer = setInterval(dianjiwtimer, 1000)
    dianjiwwww.addEventListener('click', function() {
        var dianjiwtimer2 = setInterval(function() {
            if (dianjiwwwwtime == 0) {
                dianjiwwww.disabled = false
                dianjiwwww.innerHTML = '停止时钟5秒'
                dianjiwwwwtime = 4
                clearInterval(dianjiwtimer2)
                dianjiwtimer = setInterval(dianjiwtimer, 1000)
            } else {
                dianjiwwww.disabled = true
                dianjiwwww.innerHTML = dianjiwwwwtime + 's'
                dianjiwwwwtime--
                clearInterval(dianjiwtimer)
            }
        }, 1000)
    })
</script>

var dianjiwtimer = setInterval(dianjiwtimer, 1000)
你dianjiwtimer变量名与dianjiwtimer()函数名同名了
你题目的解答代码如下:

    var dianjiw = document.getElementById('dianjiw')
    var dianjiww = document.getElementById('dianjiww')
    var dianjiwww = document.getElementById('dianjiwww')
    var dianjiwwww = document.getElementById('dianjiwwww')
    var dianjiwwwwtime = 4
 
    function dianjiwtimer() {
        var dianjiwtime = ((+new Date()) / 1000) % (60 * 60 * 24)
        dianjiw.innerHTML = (parseInt(dianjiwtime / 60 / 60) + 8) % 24
        dianjiw.innerHTML = dianjiw.innerHTML < 10 ? '0' + dianjiw.innerHTML + ':' : dianjiw.innerHTML + ':'
        dianjiww.innerHTML = parseInt(dianjiwtime / 60 % 60)
        dianjiww.innerHTML = dianjiww.innerHTML < 10 ? '0' + dianjiww.innerHTML + ':' : dianjiww.innerHTML + ':'
        dianjiwww.innerHTML = parseInt(dianjiwtime % 60)
        dianjiwww.innerHTML = dianjiwww.innerHTML < 10 ? '0' + dianjiwww.innerHTML : dianjiwww.innerHTML
    }
    dianjiwtimer() //事先调用一次,防止定时调用前的空白
    var dianjiwtimer1 = setInterval(dianjiwtimer, 1000)// dianjiwtimer变量名改为dianjiwtimer1
    dianjiwwww.addEventListener('click', function() {
        var dianjiwtimer2 = setInterval(function() {
            if (dianjiwwwwtime == 0) {
                dianjiwwww.disabled = false
                dianjiwwww.innerHTML = '停止时钟5秒'
                dianjiwwwwtime = 4
                clearInterval(dianjiwtimer2)
                dianjiwtimer1 = setInterval(dianjiwtimer, 1000)// dianjiwtimer变量名改为dianjiwtimer1
            } else {
                dianjiwwww.disabled = true
                dianjiwwww.innerHTML = dianjiwwwwtime + 's'
                dianjiwwwwtime--
                clearInterval(dianjiwtimer1) // dianjiwtimer变量名改为dianjiwtimer1
            }
        }, 1000)
    })

如有帮助,请点击我的回答下方的【采纳该答案】按钮帮忙采纳下,谢谢!

img


dianjiwwww.addEventListener('click', function() {
        var dianjiwtimer2 = setInterval(function() {
            if (dianjiwwwwtime == 0) {
                dianjiwwww.disabled = false
                dianjiwwww.innerHTML = '停止时钟5秒'
                dianjiwwwwtime = 4
                clearInterval(dianjiwtimer2)
                //等待5秒
                setTimeout("dianjiwtimer();",5000);
            } else {
                dianjiwwww.disabled = true
                dianjiwwww.innerHTML = dianjiwwwwtime + 's'
                dianjiwwwwtime--
                clearInterval(dianjiwtimer)
            }
        }, 1000)
    })

您好,我是有问必答小助手,您的问题已经有小伙伴帮您解答,感谢您对有问必答的支持与关注!
PS:问答VIP年卡 【限时加赠:IT技术图书免费领】,了解详情>>> https://vip.csdn.net/askvip?utm_source=1146287632