原生js判断用户是否操作了web页面

原生js判断用户是否操作了web页面

时间: 2018-06-06阅读: 384标签: web

 

实现思路

用户是否操作了web页面，我们可以在一定时间内根据用户是否触发了某些事件进行判断。比如用户是否点击，是否按键，是否移动了鼠标，以及滚动鼠标滚轴等。如果用户在设定的时间段内没有进行这些操作，我们就能认为用户没有操作web页面。

这里以监听鼠标移动事件来判断，通过一个定时器，来记录用户在规定时间内用户有没有触发改事件，下面就直接贴代码。

 

实现代码

var last = new Date().getTime(),
	curr = new Date().getTime(),
	out = 1 * 60 * 1000; //设置超时时间： 1分
document.onmouseover=function(){//监听鼠标移动事件
	last = new Date().getTime(); //更新操作时间
};
var inter=setInterval(function(){/*定时器  间隔1秒检测是否长时间未操作页面 */
	curr = new Date().getTime(); //更新当前时间
    if(curr - last > out){ //判断是否超时
    	clearInterval(inter);//清空定时器
        console.log("那么长时间没未操作了！");//超时操作
    }
}, 1000);

 

<!-- 设置定时任务，间隔10分钟查看系统是否使用，若闲置时间大于session失效的30分钟，则自动退出系统 -->
<script th:inline="javascript">
    var last = new Date().getTime(),
        curr = new Date().getTime(),
        out = 30 * 60 * 1000; //设置超时时间： 30分
    document.οnmοuseοver=function(){//监听鼠标移动事件
        last = new Date().getTime(); //更新操作时间
    };
    var inter=setInterval(function(){/*定时器  间隔10分钟检测是否长时间未操作页面 */
        curr = new Date().getTime(); //更新当前时间
        if(curr - last > out){ //判断是否超时
            clearInterval(inter);//清空定时器
            window.location.href = baseurl+"/dropOut";
        }
    }, 600000);
</script>