이 js 카운트 다운 타이머는 잘 작동하지만 여러 타이머에서는 마지막 div에서만 작동합니다. 모든 div에서 어떻게 실행됩니까? 두 개 이상의 타이머가 있으므로 모든 div에서 작동합니다. 어떤 지침이라도 정말 감사하겠습니다.
이것은 내 코드입니다.
HTML 및 JS.
<div id="timez1"></div>
<div id="timez2"></div>
var m = 1;
function countdowny(){
if(daysy == 0 && hoursy == 0 && minutesy == 0 && secondsy == 0){
//seconds = 0;
timez.innerHTML = "Auction Ended";
}
else{
if(secondsy == 0){
secondsy = 59;
minutesy--;
}else{
secondsy--;
}
if(minutesy == -1){
minutesy = 59;
hoursy--;
}
if(hoursy == -1){
hoursy = 23;
daysy--;
}
if(daysy == -1){
daysy = 0;
}
timez.innerHTML = "<span class=''>"+daysy+"D</span><span class=''> "+hoursy+"H</span><span class=''> "+minutesy+"M</span><span class=''> "+secondsy+"S</span>";
setTimeout(countdowny,1000);
}
}
var daysy=3;hoursy=3;minutesy=3;secondsy=3;
var timez = document.getElementById("timez"+m);
countdowny();
m++;
var daysy=2;hoursy=2;minutesy=2;secondsy=2;
var timez = document.getElementById("timez"+m);
countdowny();
m++;
우선 전체 디자인이 망가 졌다고 생각합니다. 기존 카운트 다운 위젯을 재사용하는 것을 고려해야합니다. ( 가장 간단한 JavaScript 카운트 다운 타이머? )
특정 경우에 문제는 setTimeout입니다. countdowny 메서드를 반복해서 실행하지만 항상 전역 변수를 사용합니다.
따라서 업데이트하려는 요소 (및 남은 시간)를 리팩터링하고 카운트 다운 기능에 제공해야합니다.
function countdowny(element, remainingTime) {
if(remainingTime.daysy == 0 && remainingTime.hoursy == 0 && remainingTime.minutesy == 0 && remainingTime.secondsy == 0){
//seconds = 0;
element.innerHTML = "Auction Ended";
}
else{
//Calc date as before
element.innerHTML = "<span class=''>"+remainingTime.daysy+"D</span><span class=''> "+remainingTime.hoursy+"H</span><span class=''> "+remainingTime.minutesy+"M</span><span class=''> "+remainingTime.secondsy+"S</span>";
setTimeout(countdowny,1000, element, remainingTime);
}
}
var remainingTime = { daysy:3, hoursy: 3, minutesy:3, secondsy:3 };
var timez = document.getElementById("timez"+m);
countdowny(timez, remainingTime);
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다