>  기사  >  웹 프론트엔드  >  JavaScript는 사용자가 페이지를 조작했는지 여부를 결정합니다.

JavaScript는 사용자가 페이지를 조작했는지 여부를 결정합니다.

韦小宝
韦小宝원래의
2018-01-11 10:17:042262검색

이 글은 사용자가 페이지를 운영하는데 필요한 정보를 가지고 있는지 판단하기 위해 주로 javascript를 소개합니다. js에 관심이 있는 친구들은 이 글이 js를 더 잘 배우는 데 도움이 되기를 바랍니다.

javascript 판단 여부. 사용자가 페이지를 운영했습니다

js를 사용하여 사용자가 페이지를 운영했는지 여부를 판단하면 우리가 해야 할 일은 아이디어를 정리하는 것뿐입니다.

1. 아이디어

사용자에게 조작 인터페이스가 있는지 여부에 관계없이 페이지가 지정된 시간 내에 이벤트를 실행하는지 여부를 고려할 수 있습니다. 예를 들어 사용자가 클릭했는지, 버튼을 눌렀는지, 마우스 휠을 굴렸는지 등이 있습니다. 사용자가 마우스 등을 움직였습니까? 사용자가 이러한 작업을 수행하지 않으면 대략적으로 사용자가 페이지를 조작하지 않는다고 생각할 수 있습니다. 타이머를 드릴 수 있습니다. 사용자가 지정된 시간 내에 이러한 이벤트를 트리거하는지 여부를 기록합니다. 코드를 직접 올리겠습니다. 코드의 구체적인 의미는 대략 이렇습니다.

2. 코드 데모

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>js判断用户有没有操作页面</title>
</head>
<body>
<script>
 window.onload = function (){

   (function($){
     funObj = {
       timeUserFun:&#39;timeUserFun&#39;,
     }
     $[funObj.timeUserFun] = function(time){
       var time = time || 2;
       var userTime = time*60;
       var objTime = {
         init:0,
         time:function(){
           objTime.init += 1;
           if(objTime.init == userTime){
             console.log(111) // 用户到达未操作事件 做一些处理
           }
         },
         eventFun:function(){
           clearInterval(testUser);
           objTime.init = 0;
           testUser = setInterval(objTime.time,1000);
         }
       }

       var testUser = setInterval(objTime.time,1000);

       var body = document.querySelector(&#39;html&#39;);
       body.addEventListener("click",objTime.eventFun);
       body.addEventListener("keydown",objTime.eventFun);
       body.addEventListener("mousemove",objTime.eventFun);
       body.addEventListener("mousewheel",objTime.eventFun);
     }
   })(window)


//   直接调用 参数代表分钟数,可以有一位小数;
    timeUserFun(0.1);
 }

</script>

</body>
</html><!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>js判断用户有没有操作页面</title>
</head>
<body>


<script>
 window.onload = function (){

   (function($){
     funObj = {
       timeUserFun:&#39;timeUserFun&#39;,
     }
     $[funObj.timeUserFun] = function(time){
       var time = time || 2;
       var userTime = time*60;
       var objTime = {
         init:0,
         time:function(){
           objTime.init += 1;
           if(objTime.init == userTime){
             console.log(111) // 用户到达未操作事件 做一些处理
           }
         },
         eventFun:function(){
           clearInterval(testUser);
           objTime.init = 0;
           testUser = setInterval(objTime.time,1000);
         }
       }

       var testUser = setInterval(objTime.time,1000);

       var body = document.querySelector(&#39;html&#39;);
       body.addEventListener("click",objTime.eventFun);
       body.addEventListener("keydown",objTime.eventFun);
       body.addEventListener("mousemove",objTime.eventFun);
       body.addEventListener("mousewheel",objTime.eventFun);
     }
   })(window)


//   直接调用 参数代表分钟数,可以有一位小数;
    timeUserFun(0.1);
 }

</script>

</body>
</html>=

이상이 이 글의 내용입니다. 모든 분들의 학습에 도움이 되었으면 좋겠습니다!

관련 권장 사항:

Js에서 모듈화를 구현하는 방법

JS 슬라이딩 로딩 데이터 예제 공유의 간단한 구현

문자열에서 모든 쉼표를 제거하는 JS의 자세한 예

위 내용은 JavaScript는 사용자가 페이지를 조작했는지 여부를 결정합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.