在鼠标移动或单击时停止时间答案

【问题标题】：Stop time on mouse movement or click在鼠标移动或单击时停止时间
【发布时间】：2018-07-12 18:02:28
【问题描述】：

我想在移动鼠标或按键时停止计时器。这是我到目前为止所拥有的，它通过倒计时来工作。我不确定需要做什么来停止时间。（代码来自此页面：https://www.aspsnippets.com/Articles/Automatically-redirect-User-after-Session-Timeout-in-ASPNet.aspx）

<script type="text/javascript">
    function SessionExpireAlert(timeout) {


        var seconds = timeout / 1000;
        document.getElementsByName("secondsIdle").innerHTML = seconds;
        document.getElementsByName("seconds").innerHTML = seconds;


        setInterval(function() {
            seconds--;
            document.getElementById("seconds").innerHTML = seconds;
            document.getElementById("secondsIdle").innerHTML = seconds;
        }, 1000);
        setTimeout(function() {
            //Show Popup before 20 seconds of timeout.
            $find("mpeTimeout").show();
        }, timeout - 20 * 1000);
        setTimeout(function() {
            window.location = "login.aspx";
        }, timeout);
    };
    function ResetSession() {
        //Redirect to refresh Session.
        window.location = window.location.href;
    }
    $(this).mousemove(function(e) {
        //Code goes here (Need help here)

    });
    $(this).keypress(function(e) {
        //Code goes here (Need help here)

    });

</script>

【问题讨论】：

标签： jquery asp.net session

【解决方案1】：

如果你想检测不活动并警告用户他将被注销，你可以这样做：

工作 jsfiddle：http://jsfiddle.net/newzy08/dun6gbvx/ 你可以结合一个 sweetAlert 弹出警告：http://jsfiddle.net/kbLqu1ah/21/

$(document).ready(function () {

                var time = 3000 ; //session timeout 3 seconds for the tests
                var timeout;
                var isLogout = false;

                timeout = setTimeout(function() {
                    //Things you need to do
                        isLogout = true; 
                        alert("logged out !");

                }, time);

                $(document).on('mousemove keypress', function () {
                    if (!isLogout) {
                        clearTimeout(timeout);
                        timeout = setTimeout(function() {
                            //Things you need to do
                             isLogout = true;
                             alert("logged out !");
                        }, time);
                    }
                });
            });

如果用户移动鼠标或按键，它会停止 3 秒倒计时，并重新启动它... 当 3 秒后没有活动时，将执行 alert() 代码

您可以使用库 SweetAlert2 在弹出窗口中显示漂亮的消息，参见 https://sweetalert2.github.io/ 带有倒计时消息的示例代码：http://jsfiddle.net/kbLqu1ah/4/

【讨论】：

我们可以有一个允许用户停留在页面上的警报吗？
是的，我们的想法是显示一个甜蜜的弹出窗口，例如倒计时 5 分钟，以及一个“保持连接”按钮......如果用户点击这个按钮，他就会保持连接，否则倒计时结束时的弹出窗口重定向到注销页面... Sweetalert2 有倒计时示例，请参阅他们的示例，名为“带有自动关闭计时器的消息”
我添加了自动注销弹出警告的示例代码，请参阅下面的答案，以及这个 jsfiddle：jsfiddle.net/kbLqu1ah/4

【解决方案2】：

您可以尝试的一件事是在 if 语句中包装您的秒数。例如：

 if(noMovement){
      seconds--;
      ...
 }

 $(this).mousemove(function(e) {
    noMovement=false;
});

$(this).keypress(function(e) {
    noMovement=false;
});

【讨论】：