clearInterval 不清除函数内部的 setInterval答案

【问题标题】：clearInterval does not clear setInterval inside functionclearInterval 不清除函数内部的 setInterval
【发布时间】：2021-12-15 12:15:19
【问题描述】：

如何清除 StartGame 函数中 setInterval 的时间间隔？（目前的不工作）

document.getElementById("rndletter").addEventListener("click", function StartGame() ** {
  setInterval(function() ** {
    var result0 = String.fromCharCode(Math.floor(Math.random() * (122 - 97)) + 97);
    var result1 = String.fromCharCode(Math.floor(Math.random() * (122 - 97)) + 97);
    var result2 = String.fromCharCode(Math.floor(Math.random() * (122 - 97)) + 97);
  }, 2000);
});
document.getElementById("stprndletter").addEventListener("click", function() {
  clearInterval();
});

<button id="rndletter">Start game</button>
<button id="stprndletter">Stop game</button>
<td style="text-align: center; color: blue; font-size: 150%;">
  <b>
        <div id="result0"><br />
        </div>
    </b></td>
<td style="text-align: center; color: brown; font-size: 150%;">
  <b>
        <div id="result1"><br /></div>
    </b></td>
<td style="text-align: center; color: hotpink; font-size: 150%;"><b>
        <div id="result2"><br /></div>
    </b></td>

【问题讨论】：

setInterval 返回一个 ID，您可以使用该 ID 并将其传递给 clearInterval
查看你当前的代码。想想你目前期望它如何工作。现在想想如果你设置 two setIntervals 并想清除其中一个会发生什么。这可能如何符合您当前的期望？然后去read some documentation 看看它是如何工作的。
Ohhhh ok 知道了，所以我需要为 setInterval 设置一个 ID，以便 clearInterval 可以引用它并停止，非常感谢

标签： javascript html setinterval clearinterval

【解决方案1】：

我在阅读文档后得到了答案，对于任何搜索相同内容的人，我已经这样做了：（添加了一个 ID nIntervID）

let nIntervId;

document.getElementById("rndletter").addEventListener("click", function {
    nIntervId = setInterval(function() {
        var result0 = String.fromCharCode(Math.floor(Math.random() * (122 - 97)) + 97);
        var result1 = String.fromCharCode(Math.floor(Math.random() * (122 - 97)) + 97);     
        var result2 = String.fromCharCode(Math.floor(Math.random() * (122 - 97)) + 97);

        document.getElementById("result0").innerText = result0;
        document.getElementById("result1").innerText = result1;
        document.getElementById("result2").innerText = result2;
    },2000);});
    document.getElementById("stprndletter").addEventListener("click", function() {
        clearInterval(nIntervId);
        // release our intervalID from the variable
        nIntervId = null; 
    });
});

【讨论】：