Javascript 未捕捉到clearinterval

我有一个被区间调用的函数。 然后我设置了一个调用函数的间隔。 我有一个mouseleave/mouseenter事件来分别清除和设置间隔。但是clearInterval不起作用，但是内部的匿名函数正在被调用：

interval = setInterval(function() { changeBackground(bgs); }, 2000);


    $('section#main').mouseleave(function() {
        clearInterval(interval);
        alert("j");
    });

    $('section#main').mouseenter(function() {
        var interval = setInterval(function() { changeBackground(bgs); }, 2000);
        alert("n");
    });

    function changeBackground(bgs) {
        $('#black').fadeIn(400, 'swing', function () {
            var Url = "url('content/slides/" + bgs[currentBg] + "')";
            $('#container').css('background-image', Url);
        });

        $('#black').fadeOut();

        currentBg++;

        if(currentBg == totalBg) {
            currentBg = 0;
        }
    }

试试这个：

var interval = null;

$('section#main').mouseleave(function() {
    clearInterval(interval);
    alert("j");
});

$('section#main').mouseenter(function() {
    interval = setInterval(function() { changeBackground(bgs); }, 2000);
    alert("n");
});

您在

mouseenter

中设置了

interval

变量，因此在

mouseleave

中未定义该变量

编辑

你的守则修订如下：

var interval = setInterval(function() { changeBackground(bgs); }, 2000);

$('section#main').mouseleave(function() {
    clearInterval(interval);
    alert("j");
});

$('section#main').mouseenter(function() {
    interval = setInterval(function() { changeBackground(bgs); }, 2000);
    alert("n");
});

function changeBackground(bgs) {
    $('#black').fadeIn(400, 'swing', function () {
        var Url = "url('content/slides/" + bgs[currentBg] + "')";
        $('#container').css('background-image', Url);
    });

    $('#black').fadeOut();

    currentBg++;

    if(currentBg == totalBg) {
        currentBg = 0;
    }
}

试试这个：

var interval = null;

$('section#main').mouseleave(function() {
    clearInterval(interval);
    alert("j");
});

$('section#main').mouseenter(function() {
    interval = setInterval(function() { changeBackground(bgs); }, 2000);
    alert("n");
});

您在

mouseenter

中设置了

interval

变量，因此在

mouseleave

中未定义该变量

编辑

你的守则修订如下：

var interval = setInterval(function() { changeBackground(bgs); }, 2000);

$('section#main').mouseleave(function() {
    clearInterval(interval);
    alert("j");
});

$('section#main').mouseenter(function() {
    interval = setInterval(function() { changeBackground(bgs); }, 2000);
    alert("n");
});

function changeBackground(bgs) {
    $('#black').fadeIn(400, 'swing', function () {
        var Url = "url('content/slides/" + bgs[currentBg] + "')";
        $('#container').css('background-image', Url);
    });

    $('#black').fadeOut();

    currentBg++;

    if(currentBg == totalBg) {
        currentBg = 0;
    }
}

---

interval

对于声明它的事件处理程序是本地的。必须在两个事件处理程序都可见的范围内声明变量。

interval

是声明变量的事件处理程序的本地变量。您必须在一个对两个事件处理程序都可见的范围内声明变量。谢谢，但我忘了提到间隔最初设置在（我相信是）正确的范围内。如果您将

var

设置在

mouseenter

内，则全局范围内的

interval

将与

内的
不同。您需要将
var
移动到全局
interval
定义。不工作是什么意思？你确定
changeBackground（）
正在做它应该做的事情吗？是的，它正在完全工作。我尝试过，没有初始设置间隔，只创建var interval=“”即可，然后鼠标事件/休假开始工作。您可能应该将全局
interval
声明为
null
或
“”
，只在
mouseenter（）
上更改它。如果这仍然不起作用，那么可能值得放一个JSFIDLE。谢谢，但我忘了提到间隔最初设置在（我相信是）正确的范围内。如果您将
var
设置在
mouseenter
内，则全局范围内的
间隔将与
mouseenter
内的间隔不同。您需要将
var
移动到全局
interval
定义。不工作是什么意思？你确定
changeBackground（）
正在做它应该做的事情吗？是的，它正在完全工作。我尝试不使用初始的setInterval，只创建一个var interval=“”，然后mouseenter/leave开始工作。您可能应该将您的全局
interval
声明为
null
或
”
，并且只在
mouseenter（）
上更改它。如果这仍然不起作用，那么可能值得安装一个jsfiddle。