Maison >interface Web >js tutoriel >Explication détaillée de javascript pour déterminer si l'utilisateur a exploité la page

Explication détaillée de javascript pour déterminer si l'utilisateur a exploité la page

小云云original: 2018-05-18 10:00:262156parcourir

Cet article présente principalement les informations pertinentes sur JavaScript pour déterminer si l'utilisateur a exploité la page. J'espère que cet article pourra aider tout le monde. Les amis dans le besoin pourront s'y référer.

Javascript détermine si l'utilisateur a exploité la page

Utilisez js pour déterminer si l'utilisateur a exploité la page. Il ne nous reste plus qu'à organiser nos idées.

1. Idées

Que l'utilisateur dispose d'une interface d'opération, nous pouvons déterminer si la page déclenche des événements dans le délai spécifié. Par exemple, si l'utilisateur a cliqué, appuyé sur un bouton ou fait tourner la molette de la souris. L'utilisateur a-t-il déplacé la souris, etc. Si l’utilisateur n’effectue pas ces opérations, alors on peut grossièrement penser que l’utilisateur n’exploite pas la page. Nous pouvons donner une minuterie. Pour enregistrer si l'utilisateur déclenche ces événements dans le délai spécifié. Je publierai le code directement, je n'expliquerai pas la signification spécifique du code. L'idée est à peu près la suivante.

2. Démonstration de code

<!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>

Recommandations associées :

Exemples détaillés d'éléments de page exploités efficacement par jQuery

Comment créer dynamiquement des liens en utilisant js ? Conseils pour exploiter dynamiquement les éléments de page avec js

Quelques conseils pour utiliser JS pour faire fonctionner les tables de pages et les éléments_Connaissances de base

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Partage d'exemples d'opérations simples de cookies frontaux VUEArticle suivant：Partage d'exemples d'opérations simples de cookies frontaux VUE

Articles Liés

Voir plus