clearInterval对我不起作用

Question

var waveTimes = 0;
var detectInterval = setInterval(function(){
    if(parseInt($(".people").css("top")) > 420){
        var waveInterval = setInterval(peopleWave,300);
        clearInterval(detectInterval);
    }
},300);
function peopleWave(){
    waveTimes += 1;
    if(waveTimes == 6){
        clearInterval(waveInterval);
    }
    var pic1 = "images/index/wave1.png";
    var pic2 = "images/index/wave2.png";
    if($(".wave img").attr("src") == pic1){
        $(".wave img").attr("src",pic2);
    } else {
        $(".wave img").attr("src",pic1);
    }
}

it says waveInterval not found after peopleWave runs 6 times, how can I solve it?

Answer 1

Define waveInterval outside your anonymous function, so that peopleWave has access to it:

var waveTimes = 0,
    waveInterval;
...
waveInterval = setTimeout(peopleWave, 300);