clearTimeout (타이머) 후 타이머 다시 시작

Question

clearTimeout (타이머) 후에 다른 기능을 다시 시작하려면 어떻게해야합니까?

7 초 동안 사용하지 않으면 (mousemove 이벤트 없음) refreshTable() 함수가 중지됩니다. 클라이언트가 비활성 상태에서 마우스를 움직이면 새로 고침을 다시 시작할 수 있습니까?

top 함수 refreshTable() 가능한 경우 그대로두고 싶습니다.

Codepen demo

//====DONT EDIT THIS FUNCTION IF POSSIBLE==== 
function refreshTable() { 
    window.clearTimeout(timer); 
    timer = window.setTimeout(refreshTable, 5000); 
    $("body").append("<p>refreshTable every 5 seconds.</p>"); 
} 
//======== 

var timer = window.setTimeout(refreshTable, 0); 




// If theres no activity for 7 seconds do something 
var activityTimeout = setTimeout(clientInActive, 7000); 

function clientResetActive(){ 
    $("body").attr('class', 'active'); 
    clearTimeout(activityTimeout); 
    activityTimeout = setTimeout(clientInActive, 5000); 
    //RESTART TIMER WHILE resetActive 
    //???????? 
} 

// No activity do something. 
function clientInActive(){ 
    $("body").attr('class', 'clientInactive'); 
    $("body").append("<p>clientInActive</p>"); 
    //STOP TIMER WHILE clientInActive 
    clearTimeout(timer); 
} 

// Check for mousemove, could add other events here such as checking for key presses ect. 
$(document).bind('mousemove', function(){clientResetActive()}); 

아래 그림과 같은 뭔가가 목표입니다.

Answer 1

난 당신이 타임 아웃을 중지 담당을 시작 담당 한 기능을 가지고하는 것이 좋습니다 것입니다. 이 시도 :

//====DONT EDIT THIS TOP FUNCTION IF POSSIBLE==== 
 
function refreshTable() { 
 
    stopRefreshTable(); 
 
    window.refreshTableTimer = window.setTimeout(refreshTable, 5000); 
 
    $("body").append("<p>refreshTable every 5 seconds.</p>"); 
 
} 
 
//====END==== 
 

 
function startRefreshTable() { 
 
    if(!window.refreshTableTimer) { 
 
     window.refreshTableTimer = window.setTimeout(refreshTable, 0); 
 
    } 
 
} 
 

 
function stopRefreshTable() { 
 
    if(window.refreshTableTimer) { 
 
     self.clearTimeout(window.refreshTableTimer); 
 
    } 
 
    window.refreshTableTimer = null; 
 
} 
 

 
function resetActive(){ 
 
    $("body").attr('class', 'active'); 
 
    clearTimeout(activityTimeout); 
 
    activityTimeout = setTimeout(inActive, 5000); 
 
    //RESTART TIMER WHILE resetActive 
 
    startRefreshTable() 
 
} 
 

 
// No activity do something. 
 
function inActive(){ 
 
    $("body").attr('class', 'inactive'); 
 
    $("body").append("<p>inActive</p>"); 
 
    //STOP TIMER WHILE inActive 
 
    stopRefreshTable(); 
 
} 
 

 
// If theres no activity for 7 seconds do something 
 
var activityTimeout = setTimeout(inActive, 7000); 
 
// Check for mousemove, could add other events here such as checking for key presses ect. 
 
$(document).bind('mousemove', function(){resetActive()}); 
 
startRefreshTable();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>