2015-02-06 119 views
0

我是JavaScript的初学者,我写了一个倒数计时器,但我不知道如何将分钟转换为数小时。我认为它不难,但我不能这样做,每当我写新行时它不工作。这里是我的代码:倒计时计时器javascript分钟

var minutesRemaining; 
var secondsRemaining; 
var intervalHandle; 

function resetPage() { 
    document.getElementById('inputArea').style.display = 'block'; 
    //hide pause button by default 
    document.getElementById("pauseArea").style.display = "none"; 
    //hide resume button 
    document.getElementById("resumeArea").style.display = "none"; 

} 


function resumeCountdown() { 
    tick(); 
    intervalHandle = setInterval(tick, 1000); 
    //hide resume button when resuming 
    document.getElementById("resumeArea").style.display = "none"; 
    //show resume button; 
    document.getElementById("pauseArea").style.display = "block"; 
    return; 
} 

function pauseCountdown() { 
    clearInterval(intervalHandle); 
    document.getElementById("pauseArea").style.display = "none"; 
    document.getElementById("resumeArea").style.display = "block"; 
    return; 
} 





function tick() { 
    //grab h1 
    var timeDisplay = document.getElementById('time'); 

    //turn seconds into mm:55 
    var min = Math.floor(secondsRemaining/60); 
    var sec = secondsRemaining - (min * 60); 

    //add leading 0 if seconds less than 10 
    if (sec < 10) { 
     sec = '0' + sec; 
    } 
    //concatenate with colon 
    var message = min.toString() + ':' + sec; 
    // now change the display 
    timeDisplay.innerHTML = message; 

    //stop if down to zero 
    if (secondsRemaining === 0) { 
    alert('Done!'); 
    clearInterval(intervalHandle); 
    resetPage(); 
    } 
    // subtract from seconds remaining 
    secondsRemaining--; 
} 

function startCountdown() { 
    //get contents 
    var minutes = document.getElementById('minutes').value; 
    //check if not a number 
    if (isNaN(minutes)) { 
    alert("Please enter a number!"); 
    return; 
    } 
    //how many seconds? 
    secondsRemaining = minutes * 60; 
    //call tick 
    intervalHandle = setInterval(tick, 1000); 
    //hide form 
    document.getElementById('inputArea').style.display = 'none'; 
    //show pause when running 
    document.getElementById("pauseArea").style.display = "block"; 
} 



window.onload = function() { 

    // create text input 
    var inputMinutes = document.createElement('input'); 
    inputMinutes.setAttribute('id', 'minutes'); 
    inputMinutes.setAttribute('type', 'text'); 
    inputMinutes.setAttribute('placeholder', 'Idő megadása'); 
    //pause button 
    var pauseButton = document.getElementById("pauseBtn"); 
    pauseButton.onclick = function() { 
    pauseCountdown(); 
    }; 

    //resume button 
    var resumeButton = document.getElementById("resumeBtn"); 
    resumeButton.onclick = function() { 
    resumeCountdown(); 
    }; 
    //create button 
    var startButton = document.createElement('input'); 
    startButton.setAttribute('type', 'button'); 
    startButton.setAttribute('value', 'Indítás'); 
    startButton.onclick = function() { 
    startCountdown(); 
    }; 

    // add to DOM 
    document.getElementById('inputArea').appendChild(inputMinutes); 
    document.getElementById('inputArea').appendChild(startButton); 
    document.getElementById("pauseArea").appendChild(pauseButton); 
document.getElementById("resumeArea").appendChild(resumeButton); 

    //hide pause button by default 
    document.getElementById("pauseArea").style.display = "none"; 
    //hide pause button by default 
    document.getElementById("resumeArea").style.display = "none"; 

}; 
+1

http://stackoverflow.com/questions/6312993/javascript-seconds-to-time-string-with-format-h​​hmmss – Ronnie 2015-02-06 02:56:44

回答

0

这是我刚才写的真的很快。它可能会帮助你。但你可以做一些基本的数学计算来获得转换并处理剩下的部分。像这样:

function countDown(future_date_in_millis) { 

    var date = new Date(); 
    var current_time = date.getTime(); 

    //get the future date and time 
    var future_date = future_date_in_millis.getTime(); //1438077258047; //date.getTime(); 

    // get the duration in milliseconds 
    // 1 day = 86400000 millis 
    var duration = future_date - current_time; 

    var dd = Math.floor(duration/86400000); 
    var remainder = duration % 86400000; 
    var hh = Math.floor(remainder/3600000); 
    remainder = remainder % 3600000; 
    var mm = Math.floor(remainder/60000); 
    remainder = remainder % 60000; 
    var ss = Math.floor(remainder/1000); 
    var days = document.getElementById("dd"); 
    var hours = document.getElementById("hh"); 
    var minutes = document.getElementById("mm"); 
    var seconds = document.getElementById("ss"); 

    days.innerHTML = dd.toString(); 
    hours.innerHTML = hh.toString(); 
    minutes.innerHTML = mm.toString(); 
    seconds.innerHTML = ss.toString(); 
} 
window.setInterval(function() { 
    /// call your function here 
    var d = new Date("July 15, 2015 4:52:00 PM"); 
    countDown(d); 
}, 1000);