Question

当用户单击元素时，它应该启动超时并将starttime设置为true。然后，如果用户在计时器处于活动状态时再次单击元素，则应清除超时并重新启动超时。但是我仍然从第一个和下一个超时启动控制台。如果cleartimeout只留下一个，最后一个创建？我已经在这里How to reset timeout in Javascript/jQuery?尝试了这个问题的例子。

    toggleCard: function(card){
                var Timer = null;
                if(this.startTime){
                    console.log('already activated');
                    window.clearTimeout(Timer);
                    this.startTime = false;
                }

                this.startTime = true;
                var Timer = setTimeout(function(){
//                        this.taskCard = false;
//                        this.classCard = true;
                    console.log('old timer')
                }.bind(this), 5000);

Answer 1

定义全局变量，例如

var myTimeOut = 0;

然后在方法调用clearTimeout

中

toggleCard: function(card){
                clearTimeout(myTimeOut);
                this.startTime = true;
                myTimeOut = setTimeout(function(){
//                        this.taskCard = false;
//                        this.classCard = true;
                    console.log('old timer')
                }.bind(this), 5000);

Answer 2

这样做：

toggleCard: function(card) {
    window.Timer = null; // <-----------declare timer globally here
    if (this.startTime) {
      console.log('already activated');
      window.clearTimeout(Timer); // <------- clear here if it is.
      this.startTime = false;
    }

    Timer = setTimeout(function() { // <-------assign the setTimeout here
      this.startTime = true; // <---------It has to be here.
      //   this.taskCard = false;
      //   this.classCard = true;
      console.log('old timer')
    }.bind(this), 5000);

Answer 3

我认为此代码应符合您的要求。

 var timer = null;
    var started = false;
    toggleCard = function (card) {
        if (started) {
            console.log('Timer already active');
            window.clearTimeout(timer);
        } else {
            console.log('Timer active now');
            started = true;
        }

        timer = setTimeout(function () {
            console.log('Timer elapsed! ');
            started = false;
        }.bind(this), 2000);
    };

Answer 4

每次调用该函数时都会创建一个新的Timer变量，因此当您尝试清除超时时，Timer var不会引用您创建的实际超时。

重置超时javascript

4 个答案: