Javascript clearInterval不工作

嗨，当autoswitch=true时，我正在单击调用函数。该函数还通过再次单击调用无效的clearInterval调用setInterval并将autoswitch值设置为false

需要帮忙吗

$(document).ready(function() {
  var speed = 500;
  var autoswitch = true;
  var autoswitch_speed = 4000;

  //add active class
  $('.slide').first().addClass('active');

  //hide slides
  $('.slide').hide();

  //show first slide
  $('.active').show();

  // Click next to show next slide
  $('#next').click(function() {
    nextSlide();
  });

  //Onclick go to prev slide
  $('#prev').click(function() {
    prevSlide();
  });

  //play auto slide show
  $('#playBtn').click(function() {
    if (autoswitch === true) {
      var setIntr = setInterval(nextSlide, autoswitch_speed);
      autoswitch = false;
    } else {
      clearInterval(setIntr);
      autoswitch = true;
    }
  });

  // next slide function
  function nextSlide() {
    $('.active').removeClass('active').addClass('oldActive');

    if ($('.oldActive').is(':first-child')) {
      $('.slide').last().addClass('active');
    } else {
      $('.oldActive').prev().addClass('active');
    }

    $('.oldActive').removeClass('oldActive');
    $('.slide').fadeOut(speed);
    $('.active').fadeIn(speed);
  }

  // Prev slide function        
  function prevSlide() {
    $('.active').removeClass('active').addClass('oldActive');

    if ($('.oldActive').is(':first-child')) {
      $('.slide').last().addClass('active');
    } else {
      $('.oldActive').prev().addClass('active');
    }

    $('.oldActive').removeClass('oldActive');
    $('.slide').fadeOut(speed);
    $('.active').fadeIn(speed);
  }
});

---

这是因为您将setIntr定义为该函数的局部变量。一旦它超出范围并再次被调用，您就不再具有该间隔的句柄。您需要在某个地方定义范围外的var。我会将其设置为全局变量，但我相信可能有更好的方法，因为您正在将setIntr定义为该函数的局部变量。一旦它超出范围并再次被调用，您就不再具有该间隔的句柄。您需要在某个地方定义范围外的var。我会让它成为一个全局的，但我相信可能有更好的方法

您需要在click函数之外声明setIntr。 因此，您可以将其设置在就绪功能的顶部

我已经在这里修复了您的代码：

---

您需要在单击功能之外声明setIntr。 因此，您可以将其设置在就绪功能的顶部

我已经在这里修复了您的代码：

---

只需将变量“setIntr”添加到if条件外，如下所示：

$('#playBtn').click(function() {
  var setIntr;
   if (autoswitch === true) {
    setIntr = setInterval(nextSlide, autoswitch_speed);
    autoswitch = false;
    } else {
     clearInterval(setIntr);
     autoswitch = true;
    }
  });

正如您在If条件中声明的“setIntr”在else中不可访问，因此如果您想在else中也使用它，那么您必须在If之外或全局声明它

编辑： 您正在尝试在一个条件中设置值，并在其他条件中签入。在这种情况下，必须将“setIntr”声明为全局变量

因此，工作代码应如下所示：

在document.ready中全局声明“setIntr”

然后使用以下代码：

$('#playBtn').click(function() {
 if (autoswitch === true) {
   setIntr = setInterval(nextSlide, autoswitch_speed);
   autoswitch = false;
 } else {
  clearInterval(setIntr);
  autoswitch = true;
 }
});

---

只需将变量“setIntr”添加到if条件外，如下所示：

$('#playBtn').click(function() {
  var setIntr;
   if (autoswitch === true) {
    setIntr = setInterval(nextSlide, autoswitch_speed);
    autoswitch = false;
    } else {
     clearInterval(setIntr);
     autoswitch = true;
    }
  });

正如您在If条件中声明的“setIntr”在else中不可访问，因此如果您想在else中也使用它，那么您必须在If之外或全局声明它

编辑： 您正在尝试在一个条件中设置值，并在其他条件中签入。在这种情况下，必须将“setIntr”声明为全局变量

因此，工作代码应如下所示：

在document.ready中全局声明“setIntr”

然后使用以下代码：

$('#playBtn').click(function() {
 if (autoswitch === true) {
   setIntr = setInterval(nextSlide, autoswitch_speed);
   autoswitch = false;
 } else {
  clearInterval(setIntr);
  autoswitch = true;
 }
});

---

---

var setIntr

受

if

语句的约束。将变量公开，以便在

else

语句中也使用它。如果将

setIntr

移动到全局范围，我认为它是有效的，因为您在

if

块中声明了它，因此它无法在

else

块\中访问。注意：始终确保代码的缩进是正确的，不仅可以帮助他人理解您的代码，还可以帮助您保持代码的可维护性。@Developer107否它不绑定到if语句，

var

绑定到函数作用域

let

绑定到块范围。

var setIntr

由

if

语句绑定。将变量公开，以便在

else

语句中也使用它。如果将

setIntr

移动到全局范围，我认为它是有效的，因为您在

if

块中声明了它，因此它无法在

else

块\中访问。注意：始终确保代码的缩进是正确的，不仅可以帮助他人理解您的代码，还可以帮助您保持代码的可维护性。@Developer107否它不绑定到if语句，

var

绑定到函数作用域<代码>让绑定到块范围。您在If条件中声明的“setIntr”在else中不可访问的解释是错误的

var

为整个函数声明变量@t、 妮斯，如果你查一下这个问题，你就会明白我在说什么。。我要求检查提问者是否已在if条件下声明变量，并且他正在尝试在else中访问变量。。这是不可能的。。然后我发布了我的第一个答案。成功了，非常感谢。@Spark，如果它对你有效，请不要错过接受答案的机会：）你答案的第一部分（编辑前的部分）完全错误。由于使用

var

的变量声明被提升到功能块的顶部，因此您的代码（答案中的第一个）与问题中的代码相同。您的第二个代码可以工作，但是使用

setIntr

而不进行任何声明会将其写入全局范围，我强烈建议不要这样做，最好在ready函数的回调范围内声明它。解释

如您声明的“setIntr”如果在else中无法访问的条件错误

var

为整个函数声明变量@t、 妮斯，如果你查一下这个问题，你就会明白我在说什么。。我要求检查提问者是否已在if条件下声明变量，并且他正在尝试在else中访问变量。。这是不可能的。。然后我发布了我的第一个答案。成功了，非常感谢。@Spark，如果它对你有效，请不要错过接受答案的机会：）你答案的第一部分（编辑前的部分）完全错误。由于使用

var

的变量声明被提升到功能块的顶部，因此您的代码（答案中的第一个）与问题中的代码相同。您的第二个代码可以工作，但是使用

setIntr

而不进行任何声明会将其写入全局范围，我强烈建议不要这样做，最好在ready函数的回调范围内声明它。