質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

1回答

179閲覧

JavaScript条件分岐

Chandler_Bing

総合スコア673

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

1クリップ

投稿2019/01/17 11:46

残り時間を表示し、それが1時間未満であれば1秒ずつ画面の時間を減らすプログラムです。動作自体はうまくいっていますが、
終盤のコメントアウトのところなのですが、このページに飛んできた場合もしくは、更新した場合の条件分岐になっています。

このページに飛んできた場合もしくは、更新した場合に締め切りが過去であれば、'終了'
recalc();の連続処理の中で時間が過去になった場合は'終了しました'としています(分岐の確認の為に行いました)

実行結果から、このページに飛んできた場合もしくは、更新した場合でもコメントアウトのconsole.log(1);は通過せず、
recalc()の中でしか判定できていません。問題はどこにありますか。

JS

1<!doctype html> 2<html> 3 4<head> 5 <meta charset="UTF-8"> 6 <meta name="viewport" content="width=device-width,initial-scale=1"> 7 <meta http-equiv="x-ua-compatible" content="IE=edge"> 8 <title>5-01_countdown</title> 9 <link href="../../book-js/_common/css/style.css" rel="stylesheet" type="text/css"> 10</head> 11 12<body> 13 <header> 14 <div class="header-contents"> 15 <h1>カウントダウンタイマー</h1> 16 <h2>1秒ごとに再計算する</h2> 17 </div><!-- /.header-contents --> 18 </header> 19 <div class="main-wrapper"> 20 <section> 21 <p>今から<span id="timer"></span>以内に注文すると50%オフ!</p> 22 <p>このオークションは<span id="end"></span></p> 23 </section> 24 </div><!-- /.main-wrapper --> 25 <footer>JavaScript Samples</footer> 26 <script> 27 var goal = new Date(); 28 goal.setHours(19); 29 goal.setMinutes(50); 30 goal.setSeconds(00); 31 32 var countdown = function() { 33 var now = new Date(); 34 var rest = goal.getTime() - now.getTime(); 35 var sec = Math.floor(rest / 1000) % 60; 36 var min = Math.floor(rest / 1000 / 60) % 60; 37 var hours = Math.floor(rest / 1000 / 60 / 60) % 24; 38 var days = Math.floor(rest / 1000 / 60 / 60 / 24); 39 var count = [days, hours, min, sec]; 40 return count; 41 } 42 43 var recalc = function() { 44 var count = countdown(); 45 if (count[3] < 0) { 46 document.getElementById('end').textContent = '終了しました'; 47 } else { 48 var time = count[1] + '時間' + count[2] + '分' + count[3] + '秒'; 49 document.getElementById('timer').textContent = time; 50 refresh(); 51 } 52 } 53 54 var refresh = function() { 55 setTimeout(recalc, 1000); 56 } 57 58 var count = countdown(); 59 if (count[1] < 1) { 60 recalc(); 61 } else if (count[3] < 0) { 62 console.log(1); 63 document.getElementById('end').textContent = '終了'; //質問です。 64 } else { 65 var time = count[1] + '時間' + count[2] + '分' + count[3] + '秒'; 66 document.getElementById('timer').textContent = time; 67 } 68 </script> 69</body> 70 71</html>

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

javascript

1var count = countdown(); 2console.log(count);

でcountの中身を確認してみると

count[1]が1未満になっているのではないでしょうか。

投稿2019/01/17 12:14

taketoma

総合スコア374

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問