javascript - 清除 setTimeout()

Question

我有一个视频列表，如果用户单击一个视频，然后在第一个视频完成之前单击第二个视频，则计时器会继续运行，并且第二个视频会在不应该发生变化时发生变化。我尝试使用 clearTimeout 来停止第一个视频计时器，但它没有做任何事情。

  var last_div = 0;
  function getVid(div_num, vid_length, count, id)
  {
  clearTimeout(timer1)
  time_limit = vid_length * 1000 + 4000;  //plus 4000 is to account for the lagging of the youtube video loading

    if(last_div == 0)
    {
      last_div = div_num;
      document.getElementById("vid_div" + div_num).style.background="#DCE4EB";
    }
    else
    {
      document.getElementById("vid_div" + last_div).style.background="";
      last_div = div_num;
      document.getElementById("vid_div" + div_num).style.background="#DCE4EB";
    }

    player.loadVideoById(id);
    player.setVolume(20);

    if(div_num != count)
    {
    div_num++;

      var timer1 = setTimeout(function(){
        document.getElementById("vid_div" + div_num).onclick();
      },
      time_limit);
    }
    else
    {
      setTimeout(function(){
        document.getElementById("vid_div" + div_num).style.background="";
      },
      time_limit);
    }
  }

Answer 1

var timer1是一个局部变量。这是你的问题之一。另一个问题是另一个 setTimeout 没有变量。

Answer 2

将其更改为：

 var last_div = 0,timer1;
  function getVid(div_num, vid_length, count, id)
  {
  clearTimeout(timer1)
  time_limit = vid_length * 1000 + 4000;  //plus 4000 is to account for the lagging of the youtube video loading

    if(last_div == 0)
    {
      last_div = div_num;
      document.getElementById("vid_div" + div_num).style.background="#DCE4EB";
    }
    else
    {
      document.getElementById("vid_div" + last_div).style.background="";
      last_div = div_num;
      document.getElementById("vid_div" + div_num).style.background="#DCE4EB";
    }

    player.loadVideoById(id);
    player.setVolume(20);

    if(div_num != count)
    {
    div_num++;

      timer1 = setTimeout(function(){
        document.getElementById("vid_div" + div_num).onclick();
      },
      time_limit);
    }
    else
    {
      timer1 = setTimeout(function(){
        document.getElementById("vid_div" + div_num).style.background="";
      },
      time_limit);
    }
  }