Javascript:询问如何在我多次按下警报时完全取消警报我应该取消该函数的所有调用

标签 javascript

我有这段代码示例可以一次取消 1 个警报:

 <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-`scale=1.0">`
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>Document</title>
    </head>
    <body>
        <p>Click the first button alert "Hello" after 3 second</p>
        <p>Click the second button to cancel the alert</p>
        <button onclick="myFunction()">Try it</button>
        <button onclick="myStopFunction()">Stop the Alert</button>
        <script>
        var myVar;
        function myFunction(){
            myVar=setTimeout(function(){alert("Hello")},3000);
        }
        function myStopFunction(){
            clearTimeout(myVar);
        }
        </script>
    </body>
    </html>

但是我想取消所有警报,如果你按下试试看 像 3 或 4 次,它会有 4 或 3 个警报,但如果你按下试试 并在按钮上提醒 3 次和 3 次停止我的警报警报将 取消。 所以点击次数将相等。我想创建一个函数,如果你按一下就可以尝试一百万次 然后按 1 次停止警报警报取消无论如何。 我尝试实现此代码但没有成功,所以我需要帮助。

 <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-`scale=1.0">`
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>Document</title>
    </head>
    <body>
        <p>Click the first button alert "Hello" after 3 second</p>
        <p>Click the second button to cancel the alert</p>
        <button onclick="myFunction()">Try it</button>
        <button onclick="myStopFunction()">Stop the Alert</button>
        <script>
        var myVar;
        var c`enter code here`ounter=0;
        function myFunction(){
            myVar=setTimeout(function(){alert("HEllo")},3000);
            counter++;
        }
        function myStopFunction(){
            for(var i =0;i<counter+1;i++){   
                     clearTimeout(myVar);
                     counter--;
                     }
        }
        </script>
    </body>
    </html>

最佳答案

实际上,您的代码只删除了最后一个 timeoutID。

您可以将您的 timeoutID 放入一个数组中。在您可以将所有 timeoutID 清除到循环中之后。

var arrTimeout = [];

function myFunction() {
  var myVar = setTimeout(function() {
    console.log("Hello");
  }, 3000);
  arrTimeout.push(myVar);
}

function myStopFunction() {
  arrTimeout.forEach((timeoutID) => {
    clearTimeout(timeoutID);
  })

  arrTimeout = [];
}
<button onclick="myFunction()">Try it</button>
<button onclick="myStopFunction()">Stop the Alert</button>

旧 JS 版本

var arrTimeout = [];

function myFunction() {
  var myVar = setTimeout(function() {
    alert("Hello");
  }, 3000);
  arrTimeout.push(myVar);
}

function myStopFunction() {
  for (var l = arrTimeout.length; l--;) {
    clearTimeout(arrTimeout[l]);
  }
  arrTimeout = [];
}
<button onclick="myFunction()">Try it</button>
<button onclick="myStopFunction()">Stop the Alert</button>

关于Javascript:询问如何在我多次按下警报时完全取消警报我应该取消该函数的所有调用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55121621/

相关文章:

javascript - javascript 电子邮件混淆到底有多安全?

javascript - Durandal - 防止绑定(bind)导致 subview 的组合问题

javascript - jquery 源代码,带换行符的类名?

javascript - Firebase equalTo 不工作

javascript - 获取特定输入值

javascript - 如何找到所有创建的对象的总数?

javascript - 提取链接中 ?= 后的字符

javascript - 使用静态 React 函数的返回值

javascript - 如何使用 for 循环和拼接来删除单词,然后检查数组中的特定单词

javascript - 如何根据条件设置 Mongoose 模式的默认属性值