2016-04-03 31 views
0

私はdivを隠すためのカウントダウンタイマーを持っていて、別のdivを示しています。私は秒でこれをうまく行ったが、私は数秒と数時間に秒を変換したい。カウントダウン秒を時間に変換する

どうすればいいですか?

誰にも事前のおかげで、私の質問に答える...

これは私のコードです:

var countDown = 9000; 
 
var i = setInterval(function() { 
 
    
 
    var b1 = document.getElementById('box1'); 
 
    var b2 = document.getElementById('box2'); 
 
    
 
    
 
    if(countDown === 1) { 
 
    if(b1['style'].display == 'none') { 
 
     b1['style'].display = 'block'; 
 
     b2['style'].display = 'none'; 
 
    } else { 
 
     b1['style'].display = 'none'; 
 
     b2['style'].display = 'block'; 
 
    } 
 
    clearInterval(i); 
 
    } 
 
    countDown--; 
 
    b1.innerHTML = countDown; 
 

 
}, 1000);
<!DOCTYPE html> 
 
<html> 
 

 
    <head> 
 
    <link rel="stylesheet" href="style.css"> 
 
    <script src="script.js"></script> 
 
    </head> 
 

 
    <body> 
 
    <div id="box1">9000</div> 
 

 
    <div style="display:none" id="box2">div2</div> 
 
    
 
    </body> 
 

 
</html>

+0

ちょうど9000秒の代わりにhh:mm:ssのようなカウントダウンの結果を表示したい... –

答えて

1

例:https://jsfiddle.net/306qtxot/4/

あなたはこのjQueryのを使用することができます:

var countDown = 9000; 
var i = setInterval(function() { 

    var b1 = document.getElementById('box1'); 
    var b2 = document.getElementById('box2'); 


    if(countDown === 1) { 
    if(b1['style'].display == 'none') { 
     b1['style'].display = 'block'; 
     b2['style'].display = 'none'; 
    } else { 
     b1['style'].display = 'none'; 
     b2['style'].display = 'block'; 
    } 
    clearInterval(i); 
    } 
    countDown--; 

    //This section convert "seconds" to hour And minute And second 
    var hour=Math.floor(countDown/3600); 
    var min=Math.floor(countDown%3600/60); 
    var sec=Math.floor(countDown%3600%60); 

    //Format : hh:mm:ss 
    b1.innerHTML = (hour=hour<10?"0"+hour:hour) + " : " + (min=min<10?"0"+min:min) + " : " + (sec=sec<10?"0"+sec:sec); 

}, 1000); 
+1

最後のものの前にこれらの行を追加してください。 'if(hour <10)hour =" 0 "+ hour; (min <10)min = "0" + min; if(sec <10)sec = "0" + sec; ' – qmaruf

+0

@ qmarufこれは最高の解決策です。 –

+0

大変ありがとうございます。とてもうまくいっています。 誠にありがとうございます。 –

関連する問題