1. ホーム
  2. javascript

[解決済み] ボタンで始まる30分タイマーを設定する[閉]。

2022-03-04 18:02:46

質問

30分後にタイムアウトするタイマーを作っています。まずはボタンから始めたいと思います。今のところ、こんな感じです。

<!DOCTYPE html>
    <html>
    <body>

    <p>30 minute count down.</p>

    <button onclick="countDown()">Start</button>
    <div id="status"></div>

    <script>
    function countDown() {
	    var secs = 1800;
  	    var mins = secs / 60;
	    var element = document.getElementById(status);
	    element.innerHTML = "You have "+mins.toFixed(2)+" minutes";
	    if(secs < 1) {
		    element.innerHTML = '<h2>You have no time left!</h2>';
	    }
	    secs--;
	    setTimeout('countDown()',1000);
    }
    </body>
    </html>

うまくいきません。 初心者を助けてください ありがとうございます。

解決方法は?

には、引用符を使用する必要があります。 getElementById - のように "status" . また、関数の動作も変更してください。

var secs = 1800;

function countDown() {
  var mins = secs / 60;
  var element = document.getElementById("status");
  element.innerHTML = "You have " + mins.toFixed(2) + " minutes";
  secs--;
  setTimeout(countDown, 1000);
  if (secs < 1) {
    element.innerHTML = '<h2>You have no time left!</h2>';
    secs = 1800;
  }
}
<p>30 minute count down.</p>

<button onclick="countDown()">Start</button>
<div id="status"></div>