Можно ли вложить прослушиватель событий jQuery в оператор if?

Question

Я пытаюсь установить тайм-аут для пользователей, вошедших на мою страницу. У меня есть функция тайм-аута, которую я скопировал откуда-то еще, но меня беспокоит небольшая проблема. Рассматриваемая страница - это отдельная страница, которая перезагружает свое содержимое с помощью jQuery / PHP вместо перехода пользователя к другому URL-адресу.

Слушатель событий проверяет любую активность пользователя и сбрасывает тайм-аут, когда это происходит . Я хочу, чтобы таймер запускался только тогда, когда пользователь вошел в систему, и как только тайм-аут достигает нуля, он выводит пользователя из системы. Я добился этого, переключив глобальную переменную idleEnabled между true и false, когда люди входят в систему / выходят из системы / тайм-аут.

Моя проблема : в то время как функции тайм-аута только доступный в прослушивателе событий, если пользователь вошел в систему, сам прослушиватель событий постоянно активирован и постоянно проверяется простым перемещением мыши. Я обеспокоен тем, что это может снизить производительность браузера клиента.

Что у меня есть : Я искал, могу ли я поместить прослушиватель событий внутрь if (idleEnabled == true) { listener here }, но из того, что я обнаружил, это невозможно. Даже если бы это было так, я почти уверен, что плоский if-оператор запускается только при загрузке скрипта, но рассматриваемая переменная изменится, пока сама страница не будет перезагружена.

Главный вопрос : Есть ли способ сделать это? Или это нормально, и я беспокоюсь о чем-то несущественном?

Дополнительный вопрос : Я читал, что использование глобальных переменных javascript нежелательно, но я не знал другого способа сделать это. Можно ли их так использовать?

Соответствующий jQuery код:

//create a global timeout handle
var idleTimer = null;
var idleEnabled = false;
var idleWait = 10000; //This is low for testing purposes

//to prevent the timer from disappearing if people refresh the page,
//check if the logout button is on the page when loading the script:
if ($("#logout").length) {window.idleState = true;} 

$('*').on('mousemove keydown scroll', function () { //listen for activity

    if (idleEnabled == true) { //if the timer is enabled...

        clearTimeout(window.idleTimer); //...clear it,

        window.idleTimer = setTimeout(function () { //and reset it, so that...

            $(document).trigger("timeOut"); //...the custom timeout event fires
            window.idleEnabled = false; //...and the timer is disabled

        }, idleWait);

    } 
});

$(".column").on("click", "#login, #logout", {cause: "user"}, validateUser) //Call a validation on login/logout
$(document).on("timeOut", {cause: "timeout"}, validateUser) //Call a validation on timeout

//The function validateUser will set idleEnabled = true on login and idleEnabled = false on logout.

Answer 1

У вас определенно должна быть возможность добавить слушателя внутри ветки if. При входе в систему вам нужно будет установить его снова. Вот как бы я это сделал:

var idleTimer = null;
var idleWait = 10000;

// There is probably a better way to check if the user is logged in
function isLoggedIn() {
    return $("#logout").length > 0;
}

function setActivityListener(active) {
    if (active)
        $('*').on('mousemove keydown scroll', activityHandler);
    else
        $('*').off('mousemove keydown scroll');
}

function activityHandler() {
    clearTimeout(idleTimer);
    idleTimer = setTimeout(function () {    
        $(document).trigger("timeOut");
    }, idleWait);
};


if (isLoggedIn()) {
    setActivityListener(true);
}

$(".column").on("click", "#login, #logout", {cause: "user"}, validateUser);
$(document).on("timeOut", {cause: "timeout"}, validateUser);

// On login (in validateUser?)
setActivityListener(true);

// On logout
setActivityListener(false);