자바의 동적 setInterval

다른 이벤트에 대한 타이머를 HTML로 동적으로 설정하려고합니다.자바의 동적 setInterval

function buildOnlineQuizIns(courseId, onlineQuizes) { 
var items = ''; 
var d = new Date(); 
var timeStamp = d.getTime(); 
$.each(onlineQuizes, function (key, value) { 
    var date1 = new Date(value['startDate']); 
    var t1 = date1.getTime()+value['offsetTime']*60*1000; 
    var date2 = new Date(value['endDate']); 
    var t2 = date2.getTime()+value['offsetTime']*60*1000; 

    var startDate = convertDate(value['startDate'], value['offsetTime']); 
    var endDate = convertDate(value['endDate'], value['offsetTime']); 
    items += '<table id="quizOnlineItem'+value['qsClassId']+'" class="quizOnlineItem">' + 
      '<tr><td style="color: #0000cb; font-weight: bold; width: 70px;">Quiz Set:</td><td style="margin-left: 10px;">'+value['name']+'</td></tr>' + 
      '<tr><td style="margin-right: 10px; color: #0000cb; font-weight: bold;">Header:</td><td>' + value['quizHeader'] + '</td></tr>' + 
      '<tr><td style="margin-right: 10px; color: #00B300; font-weight: bold;">Start Date:</td><td>' + startDate + '</td></tr>' + 
      '<tr><td style="margin-right: 10px; color: #DB3315; font-weight: bold;">End Date:</td><td>' + endDate + '</td></tr>' + 
     '</table>' + 
     '<div id="countdown'+value['qsId']+'" class="timer">test</div>'; 
    var timeLeft = ''; 
    if(timeStamp<t1){ 
     seconds[value['qsId']] = t1 - timeStamp; 
     countdownTimer[value['qsId']] = setInterval(timer(value['qsId']), 1000); 
    }else if(timeStamp>t1 && timeStamp<t2){ 
     seconds[value['qsId']] = t2 - timeStamp; 
     countdownTimer[value['qsId']] = setInterval(timer(value['qsId']), 1000); 
    } 
}); 
return items;

}

을 아래와 같이 타이머 기능이있다 : 그러나

var countdownTimer = []; 
var seconds = []; 
function timer(qsId) { 
    alert(countdownTimer[qsId]); 
    var days  = Math.floor(seconds[qsId]/24/60/60); 
    var hoursLeft = Math.floor((seconds[qsId]) - (days*86400)); 
    var hours  = Math.floor(hoursLeft/3600); 
    var minutesLeft = Math.floor((hoursLeft) - (hours*3600)); 
    var minutes  = Math.floor(minutesLeft/60); 
    var remainingSeconds = seconds[qsId] % 60; 
    if (remainingSeconds < 10) { 
     remainingSeconds = "0" + remainingSeconds; 
    } 
    $('#countdown'+qsId).html(days + "day " + hours + ":" + minutes + ":" + remainingSeconds); 
    if (seconds[qsId] == 0) { 
     clearInterval(countdownTimer[qsId]); 
     $('#countdown'+qsId).html("Completed"); 
    } else { 
     seconds[qsId]--; 
    } 
}

는, 아무것도 업데이트 할 때 아약스는 다음과 같이 완료되면 하는 HTML 요소를 생성하는 기능이있다 페이지가로드되었습니다. 누구든지이 문제에 대해 저를 도울 수 있습니다. 감사!!!

출처

2016-11-09 Ahad

직접 디버깅하거나 코드 전체를 게시 할 수 있습니까? –

당신은 setInterval을하는 함수를 전달하는 경우, 당신이 그것을 호출하지 않고 기능을 통과해야합니다 :

setInterval(timer(value['qsId']), 1000);

이 단 1 초 후 함수를 호출 :

이이 행이 실행되는 함수를 호출 :

setInterval(function() { 
    timer(value['qsId']) 
}, 1000);

Ps : 문제인지 확인하지 않았지만 문제가 될 것이라고 생각합니다.

출처

2016-11-09 13:42:23

감사합니다 Matheus. 타이머가 잘 작동하고 있습니다. 그러나 일 수를 세면 2000 일이 넘습니다. 여기 뭔가 잘못되었습니다. – Ahad

자바의 동적 setInterval

답변

관련 문제