LANG SELRCT

コードを書く場所についてはこちら

2018年1月14日日曜日

画面上で一定秒数操作がなかったらアラートを出す


クリック、マウス移動、キーボード操作が一定時間発生しない場合にアラートを出したい


以下のコード.gsでは
画面上で2秒間上記の操作がない場合にアラートを出します



コード.gs
function doGet() {
  return HtmlService.createHtmlOutputFromFile("index");
}
意訳
この機能がやること
指定したHTMLファイルを表示する




index.html
<!DOCTYPE html>
<html>
<body>
  <textarea></textarea>
  <script>
    var time_out;
    var milisec = 2000;

    document.addEventListener("load", set_timeout);
    document.addEventListener("click", reset_timeout);
    document.addEventListener("mousemove", reset_timeout);
    document.addEventListener("keypress", reset_timeout);
    
    function set_timeout(){
      time_out = setTimeout('show_alert()', milisec);
    }
    
    function show_alert() {
      alert(milisec / 1000 + "秒操作していません");
    }

    function reset_timeout() {
      clearTimeout(time_out);
      set_timeout();
    }
  </script>
</body>
</html>
意訳
これはHTML5文書です


テキストエリアを置く

time_outの入れ物を用意する
ミリ秒を設定する

ページが読み込まれたらset_timeoutを実行する
ページの何処かがクリックされたらreset_timeoutを実行する
マウスカーソルが動いたらreset_timeoutを実行する
キーボードのキーが押されたらreset_timeoutを実行する

この機能がやること
設定したミリ秒が経過したらshow_alertを実行する


この機能がやること
アラートにメッセージを出す


この機能がやること
time_outの処理を停止する(つまりsetTimeout('show_alert()', milisec)を止める)
set_timeout()を実行する(つまりsetTimeout('show_alert()', milisec)を再度作動させる)