带有动态键的 JS SetInterval 不清除

Question

以下代码设置了一个间隔。如果调用该功能，则应该首先清除现有间隔。然而事实并非如此。我唯一的理论是函数变量键不足以识别原始间隔。

你能用动态键调用和清除间隔吗？

function countdown(key, target, timestamp){
        
    clearInterval(key)
    key = setInterval(function(){
            
        if(timestamp <= 0){
            clearInterval(key)
        }
            
        timestamp = timestamp - 1
        target.text(timestamp)

    }, 1000)
}

激活该间隔有效

$("#somethhing").click(function(){
    countdown("testInterval", $("div.showTimer"), 12000)
})

但是，如果再次单击 #somethhing，它不会先清除间隔。就好像使用key不满足清除区间的ID一样。有没有办法做到这一点，或者是否必须使用明确定义的变量设置所有间隔以清除它们。

Answer 1

问题是当您重新分配 key 时，setInterval 返回的新值没有任何改变。您需要做的是访问变量以清除它。

您不能定义变量来自行清除它们。你必须保存ID。您可以保存一个将您想要的名称映射到这些 ID 的对象，如果您愿意，只需让函数更新该对象

Answer 2

为了使@QuarkNerd 的答案更加清晰，@Lain 的评论在这里是使用他们的建议的问题示例。

function countdown(target, timestamp){
        
    var key = setInterval(function(){
            
        if(timestamp <= 0){
            clearInterval(key)
        }
            
        timestamp = timestamp - 1
        target.text(timestamp)

    }, 1000)
    return key
}

$("#somethhing").click(function(){
    var testInterval
    clearInterval(testInterval)
    testInterval = countdown($("div.showTimer"), 12000)
})

带有动态键的 JS SetInterval 不清除

JS SetInterval with dynamic keys not clearing

javascript

key

function

setinterval

clearinterval