一定時間操作がなかったとき指定のページに戻る

タブレットで一定時間操作がなかった場合に、どうしても指定のページに戻したい時ってよくありますよね。私はあります。

そんな時はjQueryを使用しましょう。

jQueryの使い方

head内にこれを追加するだけで使用できます。
バージョンなどはお好きなものを使用してください。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

操作がない場合指定のページに遷移

コードはこちら

<script>
    $(function () {
        function timer_func() {
        //遷移させたいページを指定
            location.href = "/home";
        }
        var time_limit = 120 * 1000; //制限時間
        var timer_id = setTimeout(timer_func, time_limit);

        $('body').on('touchstart', function () {
            clearTimeout(timer_id);
            timer_id = setTimeout(timer_func, time_limit);
        });
    });
</script>

touchstartでタブレットに触ったイベントを取得
タイマーを設定した時間にもう一度戻すという処理です。

コメントを残す

%d人のブロガーが「いいね」をつけました。