3

我编写了一个脚本来检查用户是否在页面上处于活动状态，如果不是，则在 15 分钟后显示一个弹出窗口，此时显示一个从 60 秒开始倒计时的计时器，然后将用户重定向到杀死网站上用户会话的页面。

但是，虽然我可以重置显示弹出窗口的计时器，但我似乎无法取消从 60 倒计时的第二个计时器。

这是我的代码：

    <script type="text/javascript">
        idleTime = 0;
        idleRedirect = 0;
        // Count for the timer
        var wsCount = 60;

        // Start Countdown
        function startCountdown() {
            if((wsCount - 1) >= 0){
                wsCount = wsCount - 1;
                // Display countdown
                $("#countdown").html('<span id="timecount">' + wsCount + '</span>.');
                timing = setTimeout(startCountdown, 60000);
            }              
            else{
                // Redirect to session kill
                alert('Goodbye');
            }
        }

        // Pop up when the timer hits 15 minutes
        function timerIncrement() {
            idleTime = idleTime + 1;
            if (idleTime > 14) { // 15 minutes
                $('#inactiveWarning').modal('show');
                startCountdown();
            }
        }

        $(document).ready(function () {
            //Increment the idle time counter every minute.
            var idleInterval = setInterval("timerIncrement()", 5000); // 1 minute

            //Zero the idle timer on mouse movement.
            $(this).mousemove(function (e) {
                idleTime = 0;
                idleRedirect = 0;
                startCountdown.die();
            });
            $(this).keypress(function (e) {
                idleTime = 0;
                idleRedirect = 0;
                startCountdown.die();
            });
            $(this).scroll(function (e) {
                idleTime = 0;
                idleRedirect = 0;
                startCountdown.die();
            });
        })

    </script>

编辑似乎对我想如何取消计时器有些困惑。我很抱歉。

基本上，那里有查找键盘输入、鼠标移动或鼠标滚动的代码。当这些条件之一被激活时，我希望时间被它杀死。

4

7 回答 7

0

既然你想看看没有 doTimeout 是如何完成的，我会做这样的事情：

var idleTime = 0;
var idleTimeFrequency = 50;
var maxIdleTime = 60000;

function checkIdleTime() {
    idleTime += idleTimeFrequency;

    if (idleTime > maxIdleTime) {
        alert('time up!');
        // note that checkIdleTime() won't be called again 
    } else {
        setTimeout(checkIdleTime, idleTimeFrequency); // check again in 50 milliseconds
    }
}

function resetIdleTime() {
    idleTime = 0;
}

$(document).mousemove(resetIdleTime);
$(document).keypress(resetIdleTime);
$(document).scroll(resetIdleTime);
$(document).click(resetIdleTime);

setTimeout(checkIdleTime, idleTimeFrequency); // call once to get the loop started
于 2013-08-08T21:03:44.097 回答
0

我总是做这样的事情：

    isDead = false;

    function startCountdown() {
        if(isDead) {
            return;
        }
        if((wsCount - 1) >= 0){
            wsCount = wsCount - 1;
            // Display countdown
            $("#countdown").html('<span id="timecount">' + wsCount + '</span>.');
            timing = setTimeout(startCountdown, 1000);
        }              
        else{
            // Redirect to session kill
            alert('Goodbye');
        }
    }

现在您可以通过设置isDead为 true 来“杀死”它。

另外：您的代码具有可怕的重复性：

        function revive() {
            idleTime = 0;
            idleRedirect = 0;
            //startCountdown.die();
            isDead = true;
        }

        $(this).mousemove(revive).keypress(revive).scroll(revive);
于 2013-08-08T18:09:50.283 回答
0

我强烈建议您查看 jQuery 的 doTimeout 插件：http: //benalman.com/projects/jquery-dotimeout-plugin/

它可以让你在 4-5 行中做到这一点。

于 2013-08-08T18:13:33.653 回答
0

重写你的startCountdown函数：

    // Start Countdown
    function startCountdown() {
        if (timing != null) { return; }

        if((wsCount - 1) >= 0){
            wsCount = wsCount - 1;
            // Display countdown
            $("#countdown").html('<span id="timecount">' + wsCount + '</span>.');
            timing = setInterval(startCountdown, 1000);
        }              
        else{
            // Redirect to session kill
            clearInterval(timing);
            timing = null;
            alert('Goodbye');
        }
    }
于 2013-08-08T18:13:41.930 回答
0

尝试调用clearTimeout()，如下所示：

<script type="text/javascript">
    idleTime = 0;
    idleRedirect = 0;
    // Count for the timer
    var wsCount = 60;
    var timing;

    // Start Countdown
    function startCountdown() {
        if((wsCount - 1) >= 0){
            wsCount = wsCount - 1;
            // Display countdown
            $("#countdown").html('<span id="timecount">' + wsCount + '</span>.');
            timing = setTimeout(startCountdown, 1000);
        }              
        else{
            // Redirect to session kill
            clearTimeout(timing);
            alert('Goodbye');
        }
    }
</script>
于 2013-08-08T18:14:00.570 回答
0

startCountdown()我发现很难遵循您的代码在做什么，但是由于多次调用in ，您似乎有大量的第二个计时器正在运行timerIncrement()。

尝试利用如何setTimeout和setInterval实际工作：

$(function() {

   var idleTimer = null;
   var logoutCount = null;

   function startLogoutTimer() {
      var wsCount = 60;
      logoutCount = setInterval(function() {
         wsCount--;
         $("#countdown").html('<span id="timecount">' + wsCount + '</span>.');
         if (wsCount == 0) {
            // Perform redirect here
         }
      }, 1000)
   }

   function resetTimers() {
      clearTimeout(idleTimer);
      clearInterval(logoutCount);
      $("#countdown").html('');
      timer1 = setTimeout(startLogoutTimer, 1000 * 60 * 15);
   }

   $(this).mousemove(resetTimers);
   $(this).keypress(resetTimers);
   $(this).scroll(resetTimers);
   resetTimers();

});
于 2013-08-08T18:19:14.933 回答
0

如果您使用 jQuery 1.7 或更高版本，您可以使用 轻松缩短它.on，对于较小的版本，使用.live.

只需使用以下内容，您应该会遇到 0 个问题。享受！

例子

var idleActivity = 0, idleRedirect = 0, tmrCountDownActivity, tmrCountDownRedirect;
function activity(e) { // e.type will = 'keypress' || 'mousemove' || scroll
    clearInterval(tmrCountDownActivity);
    idleActivity = 0;
    tmrCountDownActivity = setInterval(countDownActivity, 60000);
}
function countDownActivity() {
    if (idleActivity >= 60) {
        //$('#inactiveWarning').modal('show');
        clearInterval(tmrCountDownActivity);
        idleActivity = 0;
        idleRedirect = 0;
        tmrCountDownActivity = setInterval(countDownRedirect, 60000);
    }
    else {
        clearInterval(tmrCountDownRedirect);
        idleActivity++;
    }
}
function countDownRedirect() {
    if (idleRedirect >= 15) {
        clearInterval(tmrCountDownRedirect);
        alert('Goodbye');
        window.location = '/';
    }
    else {
        $("#countdown").html('<span id="timecount">' + (idleRedirect+1) + '</span>.');
        idleRedirect++;
    }
}

$(function() {
    $("#dialog").dialog({ autoOpen: false });

    $(this).on('keypress mousemove scroll', activity);
    tmrCountDownActivity = setInterval(countDownActivity, 60000);

})
于 2013-08-22T18:27:17.857 回答