Javascript 用户空闲后弹出

我已经编写了一些代码，为用户显示一条消息，如果用户空闲超过一分钟，则可以忽略该消息或转到另一个页面。一切都正常，就像我希望的那样，除非用户忽略了消息。这是我的密码：

if ( valid ) {
    var idleTime = 0;
    jQuery(document).ready(function () {
    var idleInterval = setInterval(timerIncrement, 60000);
});

function resetTimer() {
    idleTime = 0;
}

jQuery(document)
.on('mousemove', resetTimer)
.on('keydown', resetTimer)
.on('scroll', resetTimer);

function timerIncrement() {
    idleTime = idleTime + 1;
    if (idleTime >= 1) {
        jQuery('#popup').show();
    }
    jQuery(window).unbind();
}

jQuery('#popupClose').click(function() {
    jQuery('#popup').hide();
});
}

---

我希望他们单击#popupClose后弹出窗口不会重新填充

您可以将信息存储在cookie中，也可以使用一个标志（取决于您是希望在每个页面视图上弹出窗口，还是仅弹出一次）

然后，在弹出窗口显示之前检查标志/cookie。例如：

function timerIncrement() {
    idleTime = idleTime + 1;
    if (idleTime >= 1) {
        if (jQuery('#popup').data('closed') == 1){
            jQuery('#popup').show();
        } 
    }
    jQuery(window).unbind();
}

jQuery('#popupClose').click(function() {
    jQuery('#popup').data('closed', 1);
    jQuery('#popup').hide();
});

---

我会这样做。初始化脚本时只需定义一个开始时间。让运行一个间隔来检查经过了多少时间。如果超过您希望的时间，则显示该对话框。如果不隐藏它。同时在事件上重置计时器。 您的javascript将如下所示

$('#btclose').on('click', function(){
    clearInterval(interv);
  $('#popup').hide();
});
var start = new Date();

var interv = setInterval(function(){
    var now = new Date();
  console.log()
  if(now-start > 5*1000){
    $('#popup').show();
  }

},10);


$('body').on('mousedown click mousemove', function(){
    start = new Date();
});

这是我的小提琴

---

似乎有效。让我知道这是否有帮助

当用户单击该元素时，您是否只是询问如何使用

clearInterval（）

？使用小提琴/plunkr会更好clearInterval（idleInterval）；这将删除间隔，这样它就不会再次发生。我想，我一直在试图找出我需要调用的名称。我尝试了return、jQuery（window）.unbind，并进行常规搜索，以找出它，但没有任何效果。