下記のスクリプトは10秒前からのカウントダウンをすることができ、「スタート・ストップ・リセットボタン」が機能します。
しかしながら、0以下でも表示され続け、永遠にマイナスの数字が膨れ上がります。
また、上記とは別のスクリプトにより、「ボタン1」をクリックすると「ボタン1がクリックされました」というアラートが表示されます。
javascript
1 2 <span id="time"></span> 3 4 <button id="start">スタート</button> 5 <button id="stop">ストップ</button> 6 <button id="reset">リセット</button> 7 <input type="button" id="btn1" value="ボタン1" onclick="btn1Click();" /> 8 9<script> 10var spanedSec = 10; 11var time; 12var startButton; 13var stopButton; 14var resetButton; 15var intervalId; 16window.onload = function() { 17 time = document.getElementById('time'); 18 time.innerHTML = spanedSec; 19 startButton = document.getElementById('start'); 20 stopButton = document.getElementById('stop'); 21 resetButton = document.getElementById('reset'); 22 23 startButton.onclick = function() { 24 start(); 25 }; 26 27 stopButton.onclick = function() { 28 stop(); 29 }; 30 31 resetButton.onclick = function() { 32 reset(); 33 }; 34}; 35function start() { 36 if (intervalId == null) { 37 intervalId = setInterval(function(){ 38 spanedSec--; 39 time.innerHTML = spanedSec; 40 }, 1000); 41 } 42} 43 44function stop() { 45 clearInterval(intervalId); 46 intervalId = null; 47} 48 49function reset() { 50 spanedSec = 10; 51 time.innerHTML = spanedSec; 52} 53 54</script> 55 56 57<script> 58function btn1Click(){ 59 alert('ボタン1がクリックされました'); 60} 61</script> 62 63
やりたいこと。
カウントダウンが0になったら、カウントダウンを停止し、「ボタン1」をクリック=「ボタンがクリックされました」というアラートを表示させたいです。
やってみたこととしては、
if (intervalId=== 0) {
clearInterval(intervalId);
intervalId = null;
document.getElementById("btn1").click();
}
というスクリプトを入れてみましたがまったく機能しません。
下記がテスト仕様です。
カウントダウンは相変わらず機能しますが、0以下の表示がされることに変わりはあせません
javascript
1 2 <span id="time"></span> 3 4 <button id="start">スタート</button> 5 <button id="stop">ストップ</button> 6 <button id="reset">リセット</button> 7 <input type="button" id="btn1" value="ボタン1" onclick="btn1Click();" /> 8 9<script> 10var spanedSec = 10; 11var time; 12var startButton; 13var stopButton; 14var resetButton; 15var intervalId; 16window.onload = function() { 17 time = document.getElementById('time'); 18 time.innerHTML = spanedSec; 19 startButton = document.getElementById('start'); 20 stopButton = document.getElementById('stop'); 21 resetButton = document.getElementById('reset'); 22 23 startButton.onclick = function() { 24 start(); 25 }; 26 27 stopButton.onclick = function() { 28 stop(); 29 }; 30 31 resetButton.onclick = function() { 32 reset(); 33 }; 34}; 35function start() { 36 if (intervalId == null) { 37 intervalId = setInterval(function(){ 38 spanedSec--; 39 time.innerHTML = spanedSec; 40 }, 1000); 41 42 if (intervalId=== 0) { 43 clearInterval(intervalId); 44 intervalId = null; 45 document.getElementById("btn1").click(); 46 } 47 48 } 49} 50 51function stop() { 52 clearInterval(intervalId); 53 intervalId = null; 54} 55 56function reset() { 57 spanedSec = 10; 58 time.innerHTML = spanedSec; 59} 60 61</script> 62 63 64<script> 65function btn1Click(){ 66 alert('ボタン1がクリックされました'); 67} 68</script> 69 70
どうすれば、カウントダウンが0になったと同時にボタン1が押され、カウントダウンが停止するようになりますでしょうか?
よろしくお願いいたします。
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。