키 누르기 후 setInterval 타이머 다시 시작

Question

색인 i을 사용하여 배열을 반복하려합니다. 현재 5 초마다 i가 증가합니다.

그러나 수동으로 증가시키는 옵션 인 i을 추가하려고합니다.이 타이머는 타이머를 다시 5 초 (5000)으로 재설정해야합니다. 어떻게 이것을 성공적으로 달성 할 수 있습니까?

따라서, 예를 들어,

[a, b, c, d, e, f, g] 

은 시작에, 그것은 표시해야 내가 오른쪽 화살표 키를 누르면, 을 디스플레이의 "B", "A"(또는 어떤 기능을 나중에 선택) 5 초 정도 그런 다음 즉시 "c"로 이동해야하지만, 다시 ->를 누르지 않으면 5 초 정도 기다려야합니다.

별도의 기능으로 증분을 넣으려고했으나 이렇게 잘 작동하지 않았습니다.

function doThis() { 
if (i < (l + 1)) { 
         $('#myDiv').html(myArray[i]); 

         i++; 
         if (i == (l + 1)) { 
          doNext(); 
         } 
        }} 

        var intervalHandle = setInterval(doThis, 5000); // start the interval by default 
        var running = true; // true if the interval is running, false if its not. 




          $("body").keydown(function (e) { 
           if (e.keyCode == 39) {//right 

            console.log("testing"); 
            if (running) { 
             clearInterval(intervalHandle); // stop interval 
             running = false; // mark interval as stopped 
            } else { 
             intervalHandle = setInterval(doThis, 5000); // start interval 
             running = true; // mark interval as started 
             doThis(); // also change the image right now 
            } 


           } else { 
            e.preventDefault(); 
           } 

          }); 

function doNext(){ 
//something here, when i ==l+1 as noted above 
} 

Answer 1

한 가지 가능한 솔루션은 오히려 직접 setInterval을 사용하면 setInterval을 호출하고 간격을 재설정하고 통과를 증가하는 데 사용할 수있는 기능을 반환하는 함수를 호출 할 수 있습니다 호출 폐쇄에서 작업을 래핑하는 것입니다 가치 있음.

function startInterval(i) { 
    var interval = setInterval(function() { 
    i++ 
    }, 5000); 

    return function() { 
    clearInterval(interval) 
    i++; 
    interval = setInterval(function() { 
    i++ 
    }, 5000); 
    } 
} 

var i = 0; 
var manualIncrement = startInterval(i); 

$('body').keydown(function(e) { 
    if(e.keyCode === 39) { 
    manualIncrement(); 
    } else { 
    e.preventDefault(); 
    } 
})