- ベストアンサー
24時間自動更新で無数回繰り返しカウントダウンする方法
- javascriptで指定した時間まで1回だけカウントダウンするスクリプトが作れることは知っています。しかし、私は24時間を自動更新で無数繰り返しカウントダウンする方法を探しています。具体的には、明日まで(あるいは今日の終わりまで)を24時間形式でカウントダウンし、O時間O分0秒になったら、また、その次の日まであと24時間0分0秒を永遠に繰り返すスクリプトが必要です。
- このようなスクリプトを探していますが、現時点で見つかっていません。他のプログラミングコミュニティでも同様の質問がされており、回答が得られていないようです。教えて!gooやエキサイトみんなの相談広場でも同じような質問がされていますが、残念ながら解決策は見つかっていません。
- このようなスクリプトを作成するための具体的なコードや方法をご存知の方がいらっしゃいましたら、教えていただけると幸いです。よろしくお願いします。
- みんなの回答 (7)
- 専門家の回答
質問者が選んだベストアンサー
#3です。 >javascript」はチンプンカンプンです。 >そのまま、コピペして使えるコードを貼ってください。 そのままコピペできるはずなんですけれど、こちらに貼らないとコピペできない理由があるのでしょうか? 同じものを、記述を少し変えたもの。 (前のものの方がわかりやすいと思いますが、チンプンカンプンなら同でしょう) <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html lang="ja"> <head><title>sample</title> <meta http-equiv="Content-Script-Type" content="text/javascript"> </head> <body> <div id="countdown"></div> <script type="text/javascript"> <!-- (function(div){ setInterval(function(){ var dt = new Date(), cd = {value:""}; div(24, "時間", cd, div(60, "分", cd, div(60, "秒", cd, (new Date(dt.getFullYear(), dt.getMonth(), dt.getDate()+1) - dt)/1000 | 0))); document.getElementById("countdown").innerHTML = "あと" + cd.value; }, 500); })(function(d, u, cd, s){ var tmp = s % d; cd.value = (tmp<10?"0":"") + tmp + u + cd.value; return (s - tmp)/d | 0; }); //--> </script> </body> </html>
その他の回答 (6)
- yambejp
- ベストアンサー率51% (3827/7415)
よくよく考えれば、時間をひっくり返すだけでいいのでは? <html> <head> <title>test</title> <script type="text/javascript"> window.onload=function(){doCountDown();} function countDown() { var now = new Date(); var hour= now.getHours(); var min= now.getMinutes(); var sec= now.getSeconds(); document.getElementById('cd1').innerHTML= "今は" + hour + "時" + min + "分" + sec + "秒"; now.setHours(-hour); now.setMinutes(-min); now.setSeconds(-sec); var hour= now.getHours(); var min= now.getMinutes(); var sec= now.getSeconds(); if(hour==0 && min==0 && sec==0) hour=24; //例外処理 document.getElementById('cd2').innerHTML= "今日の終わりまであと" + hour + "時間" + min + "分" + sec + "秒"; } function doCountDown() {setInterval(function(){countDown()}, 500);} </script> </head> <body> <div id='cd1'></div> <div id='cd2'></div> </body> </html>
- yambejp
- ベストアンサー率51% (3827/7415)
今をくらべるのではなく今の1秒前をつかうと便利です <html> <head> <title>test</title> <script type="text/javascript"> window.onload=function(){doCountDown();} function countDown() { var now = new Date(); var hour= now.getHours(); var min= now.getMinutes(); var sec= now.getSeconds(); document.getElementById('cd1').innerHTML= "今は" + hour + "時" + min + "分" + sec + "秒"; now.setSeconds(now.getSeconds() -1); //ここがポイント var hour= 23 - now.getHours(); var min= 59 - now.getMinutes(); var sec= 59 - now.getSeconds(); if(hour==0 && min==0 && sec==0) hour=24; //例外処理 document.getElementById('cd2').innerHTML= "今日の終わりまであと" + hour + "時間" + min + "分" + sec + "秒"; } function doCountDown() {setInterval(function(){countDown()}, 500);} </script> </head> <body> <div id='cd1'></div> <div id='cd2'></div> </body> </html>
>そのまま、コピペして使えるコードを貼ってください。 ここそういうサイトじゃないんで。
補足
こんなのになったのですが、僕のより良いコードないかって思って書きました。 ちょっと補足が変な感じになっちゃってすみませんw <html> <head> <title>test</title> <script type="text/javascript"> <!-- function doCountDown() { setInterval('countDown()', 500); } function countDown() { var now = new Date(); var tomorrow = new Date(now.getFullYear(), now.getMonth(), now.getDate() + 1); var diff = Math.floor((tomorrow.getTime() - now.getTime()) / 1000) + 1; var hour = Math.floor(diff / 3600); diff %= 3600; var min = Math.floor(diff / 60); var sec = diff % 60; document.getElementById('cd').innerHTML= "今日の終わりまであと" + hour + "時間" + min + "分" + sec + "秒"; } //--> </script> </head> <body onload="javacript:doCountDown();"> <div id='cd'></div> </body> </html>
- fujillin
- ベストアンサー率61% (1594/2576)
参照なさったという、「教えて!goo」で回答していた者ですが、その中のNo4のものがご質問の様になっていると思いますが試してみましたか? ただし、No3様がもっともな問題点を指摘なさってはいますが… ローカルの時計に頼らず出来る限り正確にやりたい場合は、サーバの時計を利用するか、No3様がご紹介なさっている日本標準時のサービスなどを代わりに利用するのがよいかも。
補足
大学ではまだCとC#しかまだ学んでおらず、 「javascript」はチンプンカンプンです。 そのまま、コピペして使えるコードを貼ってください。 是非、よろしくお願いします。
- yambejp
- ベストアンサー率51% (3827/7415)
setIntervalでの処理が妥当かと。 ただし、javascriptで得られる時刻はあくまでのクライアントマシンの ローカルな時間でしかないので、ただしい時間(もしくはサーバーの時間で) 処理したいのであれば、ajaxなどで定期的にサーバーから時間をもってきて 同期処理をいれないと想定したものにはならないと思います。
補足
大学ではまだCとC#しかまだ学んでおらず、 「javascript」はチンプンカンプンです。 そのまま、コピペして使えるコードを貼ってください。 是非、よろしくお願いします。
パートナーサイトというものを知らずによその他人をマルチポスト扱いするのはよくないなあ(笑) で、回答ですけども。 その質問者さんがたまたま理解できなかっただけで答えは出てますよ。 0時と現在時刻の差をsetIntervalで更新して表示。これだけ。
補足
大学ではまだCとC#しかまだ学んでおらず、 「javascript」はチンプンカンプンです。 そのまま、コピペして使えるコードを貼ってください。 是非、よろしくお願いします。
補足
毎度すみませんが、具体的な理由を僕みたいな度素人にもわかるように教えてください。 是非、お願いします。