clearinterval不适用于mouseenter

时间:2016-04-10 09:08:11

标签: javascript jquery web

清除间隔在滑块中不起作用我已经尝试了很多但面临同样的问题是否有任何人可以告诉这里有什么问题以及我如何解决这个问题?这是Jquery中的Image滑块

<script>
  $(document).ready(function() {
    var current = 2;
    var sl = $(".aa").length;
    var interval;
    function startSlider() {
      interval = setInterval(function() {
        $(".slider-wrapper").delay(2000);
        $(".slider-wrapper").animate({
          'margin-left': '-=910'
        }, 2000, function() {
          current++;
          if (current === sl) {
            current = 1;
            $(".slider-wrapper").delay(2000).animate({
              'margin-left': '0'
            }, 2000);
          }
        })
      }, 3000);
    }
    function stopSlider() {
      clearInterval(interval);
    }
    $(".slider-wrapper").on('mouseenter', stopSlider).on('mouseleave', startSlider);
    startSlider();
  });
</script>

1 个答案:

答案 0 :(得分:0)

原因是因为interval变量是一个全局变量(与窗口相关联,如果我们在窗口的上下文中,可以使用window.intervalinterval访问)< / p>

当您在stopSlider内呼叫$(".slider-wrapper").on('mouseenter'时,this关键字会向$(".slider-wrapper")元素提供,而不是window

换句话说,interval未在此上下文中定义。

要解决此问题,只需在窗口上下文中执行stopSlider,如下所示: stopSlider.call(window)代替stopSlider

希望这有帮助。