재설정 간격이 자바 스크립트에서 작동하지 않습니다.

Question

clearInterval(interval) 
var interval = setInterval(function(){ 
    console.log('running') 
},1000); 

위의 코드를 클릭 이벤트에 사용하면 console.log ('running')가 위의 코드를 실행할 때 여러 번 트리거됩니다. 이유는 무엇입니까? setInterval을 실행하기 전에 간격을 먼저 지 웁니다.

Answer 1

는 코드를 가정하면 다음과 같이 보입니다. 두 번째로 버튼을 클릭하면 함수가 실행되지만 함수가 처음 실행될 때 함수 내에 작성된 변수에 대한 참조가 없습니다. 클릭 핸들러 기능의 첫 번째 줄에 console.log(interval)을 추가하십시오. 이를 해결하려면 클릭 핸들러가 액세스 할 수있는 어딘가의 참조를 interval으로 유지해야합니다. 예를 들면 다음과 같습니다.

var interval = null; 

$('#someButton').on('click', function() { 
    clearInterval(interval) 
    interval = setInterval(function(){ 
     console.log('running') 
    },1000); 
}); 

작동 범위의 예는 What is the scope of variables in JavaScript?을 참조하십시오.

Answer 2

좋아, 이제 문제를 이해합니다. 더 높은 범위 (필요한 경우 전역)에 interval을 선언해야합니다. 당신의 문제는 interval입니다. varible은 클릭 기능 내부에 선언되어 있기 때문에 로컬 변수입니다. 다른 곳에서 참조를 액세스하여 지울 필요가 있습니다.

클릭하고 모든 기능을 클릭 기능에 넣지 말고 클릭 기능이 작동하는 것과 동일한 수준으로 설정하십시오.

var interval; 

function doInterval() { 
    if (interval != undefined) clearInterval(interval); 
    interval = setInterval(function(){ 
     console.log('running'); 
    },1000); 
} 

P/S : 질문을 명확히하기 위해 질문을 편집해야합니다.

$('#someButton').on('click', function() { 
    clearInterval(interval) 
    var interval = setInterval(function(){ 
     console.log('running') 
    },1000); 
}); 

다음 발생하는 문제의 범위가 함께 할 수있는 모든은 다음과 같습니다