setTimeout 사용 방법

3889 단어 JavaScript

setTimeout

<h3>全ての色が混ざり合うと白くなるものは何か?</h3>
<h4 id="temporaryBox" class="temporaryBox">加法減色
 <p><img src="img/rgb.png" alt=""></p></h4>
<p>
<input type="button" value="答えを見る" id="btnShowBox" class="btn" onclick="showBox();">
</p>
let timerId;

// ボックスを表示して、タイマーを開始
function showBox() {
  document.getElementById("temporaryBox").style.display = "block"; // ボックスを表示
  timerId = setTimeout( closeBox , 5000 ); // タイマーを開始
  document.getElementById("btnShowBox").disabled = true; // 表示用ボタンを無効化
}
// ボックスを消して、タイマーを終了
function closeBox() {
  document.getElementById("temporaryBox").style.display = "none"; // ボックスを消す
  clearTimeout( timerId ); // タイマーを終了
  document.getElementById("btnShowBox").disabled = false; // 表示用ボタンを有効化
}

좋은 웹페이지 즐겨찾기