Q&A
前提・実現したいこと
プログラミング初学者です。簡単なことなのかもしれませんが、こねくりまわしてもうまく行かなかったので質問させていただきます。
ストップウォッチのコードをもとに、10秒ぴったりストップウォッチミニゲームを作ろうとしています。
ストップウォッチをスタートから9秒01~11秒99までの間にストップを押すとチャレンジ成功となり、次のページへアクセスできるボタンを表示する予定です。
しかし、成功となる時間制限がうまくできず、ストップボタンを押すと経過時間が意図したものでなくても「おめでとうございます...」という成功した場合の分岐に進んでしまいます。Firefoxでコンソールを開きながらやっていますが、エラーは出ませんでした。
思った通りに時間を区切るためによい書き方はありますでしょうか？ご教示願います。
該当のソースコード
HTML
1<!DOCTYPE html> 2<html> 3<head> 4 <meta charset="utf-8"> 5 <title>１０秒ぴったり</title> 6</head> 7<body> 8 <div id="timer">00:00:00</div> 9 <input type="button" value="start" id="start"> 10 <input type="button" value="stop" id="stop"> 11 <input type="button" value="reset" id="reset"> 12 <script src="stopwatch.js"></script> 13 <div id="clear"></div> 14</body> 15</html> 16
JavaScript
1(function(){ 2 'use strict'; 3 4 var timer = document.getElementById('timer'); 5 var start = document.getElementById('start'); 6 var stop = document.getElementById('stop'); 7 var reset = document.getElementById('reset'); 8 9 var m; 10 var s; 11 var ms; 12 13 var startTime; 14 var elapsedTime = 0; 15 var timerId; 16 17 function timerLabel(){ 18 //分,秒,ミリ秒 19 m = Math.floor(elapsedTime / 60000); 20 s = Math.floor(elapsedTime % 60000 / 1000); 21 ms = elapsedTime % 1000; 22 //桁数 23 m = ('0' + m).slice(-2); 24 s = ('0' + s).slice(-2); 25 ms = ('0' + ms).slice(-2); 26 timer.textContent = m + ':' + s + ':' + ms; 27 } 28 29 function countUp(){ 30 timerId = setTimeout(function(){ 31 elapsedTime = Date.now() - startTime; 32 timerLabel() 33 countUp(); 34 },10); 35 } 36 37 start.addEventListener('click',function(){ 38 startTime = Date.now(); 39 countUp(); 40 }); 41 42 stop.addEventListener('click',function(){ 43 clearTimeout(timerId); 44 45 var clear = document.getElementById('clear'); 46 if(9000 < elapsedTime < 11000){ 47 clear.innerHTML = '<h3>おめでとうございます！次に進んでください</h3>' + '<br>' + '<input type="button" value="次へ">'; 48 }else{ 49 clear.innerHTML = "<h3>残念! リセットボタンを押してもう一度チャレンジ</h3>"; 50 } 51 }); 52 53 reset.addEventListener('click',function(){ 54 elapsedTime = 0; 55 timerLabel(); 56 }); 57})(); 58
回答2件
0
最後のelapsedTimeを判定する部分のif文の条件式の指定方法が間違っています。
~~if(9000 < elapsedTime < 11000)~~
↓
if(9000 < elapsedTime && elapsedTime < 11000)
です。
追記：
ページが開きっぱなしだったので、回答がついていることに気が付きませんでした。
全く同じ回答をしてしまいお恥ずかしいです、こちらの回答は無視して下さい。
投稿2020/01/16 18:39
編集2020/01/16 18:43
総合スコア360
0
ベストアンサー
下記部分をひとまず直してみてください。
js
1// if(9000 < elapsedTime < 11000) 2// ↓ 3 if(9000 < elapsedTime && elapsedTime < 11000)
投稿2020/01/16 18:28
総合スコア69400
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。