ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScript はどのようにしてユーザーのアイドル時間を検出できるのでしょうか?

JavaScript はどのようにしてユーザーのアイドル時間を検出できるのでしょうか?

Patricia Arquette
Patricia Arquetteオリジナル
2024-12-10 22:50:11410ブラウズ

How Can JavaScript Detect User Idle Time?

JavaScript でのアイドル時間の検出

ユーザーの非アクティブな時間または CPU 使用率のない時間として定義されるアイドル時間は、さまざまな目的に活用できます。コンテンツのプリフェッチなど。この記事では、JavaScript のアイドル時間を特定する方法について説明します。

バニラ JavaScript の実装

1 つの方法には、バニラ JavaScript のイベントベースのアプローチを利用することが含まれます。マウスの動き、キーストローク、スクロールなどのユーザー アクティビティを示す DOM イベントのリスナーを登録することで、システムはユーザーが非アクティブになったことを検出できます。

var inactivityTime = function () {
    var time;
    window.onload = resetTimer;
    // DOM Events
    document.onmousemove = resetTimer;
    document.onkeydown = resetTimer;

    function logout() {
        alert("You are now logged out.")
        //location.href = 'logout.html'
    }

    function resetTimer() {
        clearTimeout(time);
        time = setTimeout(logout, 3000)
        // 1000 milliseconds = 1 second
    }
};

inactivityTime 関数を初期化することで、JavaScript スクリプトが開始されます。ユーザーのアクティビティをリッスンします。指定した時間間隔 (3000 ミリ秒など) 内にイベントがトリガーされない場合は、ログアウト関数が呼び出され、ユーザーの非アクティブ性が示されます。

検出範囲の拡大

機能を強化するにはアイドル時間の検出、追加の DOM イベントを登録できます。よく使われるイベントinclude:

  • document.onload
  • document.onmousemove
  • document.onmousedown
  • document.ontouchstart
  • document.onclick
  • document.onkeydown

の場合スクロール中のイベント処理が改善され、次のコードを使用できます:

document.addEventListener('scroll', resetTimer, true);

addEventListener に渡される true パラメータにより、バブル フェーズではなくキャプチャ フェーズ中にイベントが確実にキャプチャされ、スクロール可能な要素内でも確実に検出されます。 .

要約

JavaScript のイベントベースのモデルを利用することで、開発者は次のことができます。ユーザーのアイドル時間を効果的に検出します。この機能は、コンテンツの事前読み込み、電源管理、自動ログアウト メカニズムなど、さまざまなシナリオで使用できます。

以上がJavaScript はどのようにしてユーザーのアイドル時間を検出できるのでしょうか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。