非活动 10 分钟后显示弹出窗口答案

【问题标题】：Show Popup after 10min of inactive非活动 10 分钟后显示弹出窗口
【发布时间】：2021-11-12 10:30:40
【问题描述】：

您好，找不到代码：x 有人可以发帖，或者解释一下我如何在 10 分钟不活动后制作弹出窗口？

当页面加载后 10 分钟内成员处于非活动状态时，成员将收到一个带有一些按钮和文本的弹出窗口

<div>
    <p>Away from keyboard?</p>
    <ul class="button">
        <li><a href="#0">I'm Back!</a></li>
    </ul>
</div>

【问题讨论】：

或许可以试试这里提供的解决方案stackoverflow.com/questions/667555/…

标签： javascript time popup

【解决方案1】：

 var seconds = 0;
        var timeoutCounter = setInterval(function(){
        seconds++;
        if(sec == 600) {
    // do stuff to launch popup
    clearInterval(timeoutCounter);
    }
        }, 1000);


    $(document).mousemove(function (e) {
clearInterval(timeoutCounter);
        seconds = 0;
    setInterval(timeoutCounter);
        });
        $(document).keypress(function (e) {
            clearInterval(timeoutCounter);
            seconds = 0;
    setInterval(timeoutCounter);
        });

这基本上每秒运行一次 - 如果是第 600 秒，它会在运行您的代码后退出。

Source for idle checking

【讨论】：

你不检查用户是否空闲。你必须监控鼠标/键盘。
@Ilya 当用户进行有意义的交互时，拥有该页面的人应该能够设置 seconds = 0。有时你不想太笼统地这样做。
这不适用于 OP 所要求的“在 10 分钟不活动后”，因此我建议您让 OP 知道这一点或用注释更新您的答案。
@Ilya 和 Franco，你说得对。添加了空闲检查器。

【解决方案2】：

将事件与setTimeout 方法一起附加到document 对象以显示弹出窗口。一种方法是

var popupTimer,
        TIME_OUT = 600;

// function that displays the popup
function displayPopup() {
    // display the popup here
}

// Set the timeout to display the popup
popupTimer = setTimeout(displayPopup, TIME_OUT);

// attch events to the document object
// you can add more events here based on
// what events you want to track
$(document).on('click change keypress', function() {

  // clear the timeout whenever the event is handled
  clearTimeout(popupTimer);

  // Reset the timer
  popupTimer = setTimeout(displayPopup, TIME_OUT);
});

【讨论】：