Question

我使用以下代码使用javascript检查空闲时间，但点击或按键时不会触发警报消息。

码

$(document).ready(function () {
    alert('hi')
    var idleTime = 0;
    //Increment the idle time counter every minute.
    var idleInterval = setInterval(timerIncrement, 30000); // 1 minute

    //Zero the idle timer on mouse movement.
    $(this).mousemove(function (e) {
        alert('mouse moved')
        idleTime = 0;
    });
    $(this).keypress(function (e) {
        alert('key pressed')
        idleTime = 0;
    });

});

function timerIncrement() {
    idleTime = idleTime + 1;
    if (idleTime > 1) { // 20 minutes
        alert('No action')
    }
}

Answer 1

一切似乎对我有用。但是，请注意没有单击处理程序，因此您将无法拦截单击事件。我已按以下方式更新Your Fiddler ...

将idleTime移出ready函数范围并将其设置为全局，以便timerIncrement增量也可以访问它。否则，您将收到错误
将alert的所有来电替换为console.log ... alert有点干扰
为了便于说明，将setInterval超时更改为5秒，避免等待一分钟才能看到“无操作”消息

Answer 2

您的事件处理程序工作正常...基于您对我上面发布的小提琴的评论...我猜问题是变量idleTime的范围。

变量idleTime在dom ready handler方法中声明，因此它将在dom ready handler onlye的范围内可用...但是方法timerIncrement被声明在范围之外dom ready handler ...所以你的控制台should give an error说Uncaught ReferenceError: idleTime is not defined。

这里的解决方案是更多dom ready处理程序中的方法timerIncrement，以便它可以访问dom ready handler中定义的闭包变量

$(document).ready(function () {
    console.log('hi')
    var idleTime = 0;
    //Increment the idle time counter every minute.
    var idleInterval = setInterval(timerIncrement, 1000); // 1 minute

    //Zero the idle timer on mouse movement.
    $(this).on('mousemove keypress click', function (e) {
        console.log('reset: ', e.type)
        idleTime = 0;
    });


    function timerIncrement() {
        idleTime = idleTime + 1;
        if (idleTime > 1) { // 20 minutes
            console.log('No action')
        }
        $('#result').html(idleTime)
    }
});

演示：Fiddle

js检查空闲时间不起作用

2 个答案: