檢測JavaScript 中的空閒時間

簡介：

在Web 開發中，了解使用者活動對於優化效能和提供更好的使用者體驗至關重要。偵測空閒時間（定義為不活動或 CPU 使用率較低的時間段）可以幫助您觸發預先載入內容或使用者驗證等操作。

JavaScript 實作：

偵測在JavaScript 中空閒時，您可以使用以下普通JavaScript 方法：

程式碼片段：

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() 函數：

window.onload = function() {
  inactivityTime();
}

自訂：

您可以新增更多 DOM 事件來監控使用者活動。一些最常用的事件是：

document.onload = resetTimer;
document.onmousemove = resetTimer;
document.onmousedown = resetTimer; // touchscreen presses
document.ontouchstart = resetTimer;
document.onclick = resetTimer;     // touchpad clicks
document.onkeydown = resetTimer;   // onkeypress is deprectaed
document.addEventListener('scroll', resetTimer, true); // improved; see comments

為了更好的定制，可以使用數組來註冊多個事件：

window.addEventListener('load', resetTimer, true);
var events = ['mousedown', 'mousemove', 'keypress', 'scroll', 'touchstart'];
events.forEach(function(name) {
 document.addEventListener(name, resetTimer, true);
});

透過自訂您監視的事件，您可以自訂空閒時間檢測以滿足您的特定應用程式的需求。