Question

我做了一点测试来检查用户是否“离开”（不活跃）;

function away_status(){
    $("#away_stat_update").everyTime(1000, function(i) { 
        var number = Number($(this).html());
        if( number == 20 ) {
            // set user as away 
            alert( "user away" );
        }
        if( number > 20 ) {
            $("*").mousemove(function(e){
                $("#away_stat_update").html(0);
                var number = Number(0);
                // reset user to being online
                alert( "user back online" );
            });
        }
        $("#away_stat_update").html( number + 1 );
    });
    $("*").mousemove(function(e){
        $("#away_stat_update").html(0);
    });
}
away_status();

唯一的问题是，当数字大于20并且移动鼠标时，它会一直警告“用户重新上线”，而不是只执行一次。这个号码正在重置。

Answer 1

我以稍微不同的方式回答这个问题 - 因为我认为用最简洁的代码优雅地解决问题总是很好。

此示例正是您想要的，完全正常工作。它不会将数字写入DOM，而是将其保存在JavaScript的内存中 - 如果您希望显示数字，可以将其写入元素，但这样可以节省每次都检索它的时间。

警报也可以按照您的描述进行操作。

var number = 0;
var timer;

function handle_mouse_move() {
    if (number > 20) {
        alert("User back online, was away for approx " + number + " seconds");
    }
    number = 0;
}

function handle_timer() {
    if (number === 20) {
        alert("User away");
    }
    number++;
    timer = window.setTimeout(function() { handle_timer(); }, 1000);
}

$(document).ready(function() {
    timer = window.setTimeout(function() { handle_timer(); }, 1000);

    $("*").mousemove(function(e){
        handle_mouse_move();
    });
});

Answer 2

您使用相同的方法将多个mousemove事件附加两次，这无关紧要......所以每次计时器过去时，您都会附加两个新的事件处理程序。合并并移动mousemove事件代码并将其移出away_status ()方法。

至于重置，在第一个mousemove事件处理程序中更改：

var number = Number(0);

到

number = Number(0); // or just = 0;

注意我们删除了var ...它看起来是一个范围问题。

Answer 3

$("*").mousemove(function(e){
    // ...
});

这将为mousemove事件分配一个事件处理程序，该事件将保留在那里，直到你删除它为止。

Answer 4

看起来每次执行回调函数时都会添加一个mousemove事件，即每秒钟。

function away_status(){
    $("#away_stat_update").everyTime(1000, function(i) { 
        var number = Number($(this).html());
        if( number == 20 ) {
            // set user as away 
            alert( "user away" );
        }
        $("#away_stat_update").html( number + 1 );
    });
}
away_status();

$("*").mousemove(function(e){
    $("#away_stat_update").html(0);
    alert( "user back online" );
});

这样您只需设置一次mousemove事件，无需取消绑定。注意，只要移动鼠标，它就会重置数字，它不会等到数字> 20。

jquery - 决定用户是否“离开”

4 个答案: