我有一个带有两个按钮的简单 HTML 代码。当按下一个按钮时,计时器就会启动。该计时器位于通常使用 JQuery 检索的脚本中。
然后我们有另一个按钮,可以删除(清除)脚本。不幸的是,计时器仍然驻留。当我尝试两次删除脚本时,我确实收到了错误,但即使脚本被删除,我也可以启动多个计时器。
<html>
<body>
<button onclick="StartTimer();" >Start Timer</button>
<button onclick="DeleteScript();" >Stop Timer</button>
<script>
function DeleteScript()
{
document.scripts.flexiblesource.remove();
}
</script>
<script id="flexiblesource">
var intervalId;
function DoThis()
{
console.log("Doing it...");
}
function StartTimer()
{
intervalId = window.setInterval(
function()
{
DoThis();
}
, 1000);
}
</script>
</body>
</html>
我原以为计时器也会被“摧毁”。
在删除脚本的函数中,在从页面中删除脚本之前调用
clearInterval
函数 - 如:
function DeleteScript() {
if( !isNaN(intervalId) )clearInterval( intervalId );
document.scripts.flexiblesource.remove();
console.log('#ok#')
}
<button onclick="StartTimer();">Start Timer</button>
<button onclick="DeleteScript();">Stop Timer</button>
<script id='flexiblesource'>
var intervalId;
var i=1;
function DoThis() {
console.clear();
console.log(`Doing it...${i}`);
i++;
}
function StartTimer() {
intervalId = window.setInterval(
function() {
DoThis();
}, 1000);
}
</script>