Déterminez si le navigateur est fermé ou actualisé en fonction des compétences JavaScript (super précises)

Déterminez si le navigateur est fermé ou actualisé en fonction des compétences JavaScript (super précises)_javascript

WBOY

Libérer： 2016-05-16 15:16:52

original

2969 Les gens l'ont consulté

Cet article est un contenu de base résumé par l'éditeur. Je pense personnellement qu'il sera utile à tout le monde. Veuillez voir ci-dessous pour le contenu spécifique :

Onload n'est exécuté que lorsque la page se charge
N'exécutez onunload
que lorsque la page est fermée Lorsque la page est actualisée, onbeforeunload est exécuté en premier, puis onunload et enfin onload.

Après vérification, je suis arrivé à la conclusion :

//Pour IE, Google, 360 :

//Onload n'est exécuté que lorsque la page est chargée
//Lorsque la page est actualisée, l'événement onbeforeunload est exécuté avant l'actualisation, l'événement onunload est exécuté lorsque la nouvelle page est sur le point de remplacer l'ancienne page, et enfin l'événement onload est exécuté.
//Lorsque la page est fermée, l'événement onbeforeunload se produit en premier, puis l'événement onunload.

//Pour Firefox :

//Lorsque la page est actualisée, seul l'événement onunload est exécuté ; lorsque la page est fermée, seul l'événement onbeforeunload est exécuté
Revenons donc au sujet, comment déterminer si le navigateur est fermé ou actualisé ? J'ai essayé des centaines de fois selon différents avis sur Internet sans succès Les différents avis sont les suivants :

window.onbeforeunload = function() //author: meizz 
{ 
var n = window.event.screenX - window.screenLeft; 
var b = n > document.documentElement.scrollWidth-20; 
if(b && window.event.clientY < 0 || window.event.altKey) 
{ 
alert("是关闭而非刷新"); 
window.event.returnValue = ""; //这里可以放置你想做的操作代码 
}else
{ 
alert("是刷新而非关闭"); 
} 
} 
window.onbeforeunload = function() //author: meizz 
{ 
var n = window.event.screenX - window.screenLeft; 
var b = n > document.documentElement.scrollWidth-20; 
if(b && window.event.clientY < 0 || window.event.altKey) 
{ 
alert("是关闭而非刷新"); 
window.event.returnValue = ""; //这里可以放置你想做的操作代码 
}else
{ 
alert("是刷新而非关闭"); 
} 
}

Copier après la connexion

function CloseOpen(event) {
if(event.clientX<=0 && event.clientY<0) {
alert("关闭");
}
else
{
alert("刷新或离开");
}
}
</script>
<body onunload="CloseOpen(event)">

Copier après la connexion

........................

Aucune de ces méthodes n'a fonctionné, mais je n'ai pas abandonné, réfléchissant et réfléchissant...

D'après ce qui précède, je suis arrivé à la conclusion,

//Pour IE, Google, 360 :

//Pour Firefox :

//Lorsque la page est actualisée, seul l'événement onunload est exécuté ; lorsque la page est fermée, seul l'événement onbeforeunload est exécuté
Lors de l'actualisation, commencez par onbeforeunload, puis récupérez les données de la demande du serveur. Lorsque la nouvelle page est sur le point de remplacer l'ancienne page, l'événement onunload se produit lorsque la page est fermée, l'événement onbeforeunload se produit en premier, puis l'événement onunload immédiatement. Ensuite lors du rafraîchissement, le temps entre onbeforeunload et onunload est nettement plus long qu'à la fermeture, et c'est bien le cas après test.

J'ai posté mon code de test :

var _beforeUnload_time = 0, _gap_time = 0;
var is_fireFox = navigator.userAgent.indexOf("Firefox")>-1;//是否是火狐浏览器
window.onunload = function (){
_gap_time = new Date().getTime() - _beforeUnload_time;
if(_gap_time <= 5) 
$.post(pathName+"/back/bi!aaaa.s2&#63;t="+_beforeUnload_time,{msg:"浏览器关闭",time:_gap_time},function(json){},"text");
else 
$.post(pathName+"/back/bi!aaaa.s2&#63;t="+_beforeUnload_time,{msg:"浏览器刷新",time:_gap_time},function(json){},"text");
}
window.onbeforeunload = function (){
_beforeUnload_time = new Date().getTime();
if(is_fireFox)//火狐关闭执行
$.post(pathName+"/back/bi!aaaa.s2&#63;t="+_beforeUnload_time,{msg:"火狐关闭"},function(json){},"text");
};

Copier après la connexion

Code du serveur (implémentation SSH) :

public void aaaa(){
System.out.println(base.getParameter("msg")+"，间隔："+base.getParameter("time"));
}

Copier après la connexion

Pour if(_gap_time <= 5), le 5 ici est ma valeur par défaut, qui dépend du navigateur client et est également liée à la configuration de la machine client. Lorsque ma machine ferme le navigateur, l'événement onbeforeunload est le même que. L'intervalle de données de l'événement onunload ne dépasse pas 2 ms et l'intervalle lors de l'actualisation est 100 % supérieur à 2 ms car il faut accéder au serveur. Les résultats de mes tests sont publiés ci-dessous :

Ce qui suit présentera le navigateur pour fermer l'événement d'écoute et déterminer s'il faut actualiser ou fermer

L'utilisation de onunload ou onbeforeunload peut surveiller l'événement de fermeture du navigateur, mais elle ne peut pas faire la distinction entre la fermeture et l'actualisation. Le code js suivant peut surveiller partiellement l'événement de fermeture du navigateur !

//鼠标相对于用户屏幕的水平位置 - 窗口左上角相对于屏幕左上角的水平位置 = 鼠标在当前窗口上的水平位置
var n = window.event.screenX - window.screenLeft;
//鼠标在当前窗口内时，n<m，b为false；鼠标在当前窗口外时，n>m，b为true。20这个值是指关闭按钮的宽度
var b = n > document.documentElement.scrollWidth-20;
//鼠标在客户区内时，window.event.clientY>0；鼠标在客户区外时，window.event.clientY<0
if(b && window.event.clientY < 0 || window.event.altKey || window.event.ctrlKey){
关闭浏览器时你想做的事
}else if(event.clientY > document.body.clientHeight || event.altKey){
关闭浏览器时你想做的事
}

Copier après la connexion

Ce morceau de js peut surveiller le clic de la souris sur le bouton de fermeture du navigateur, le clic droit de la souris sur la barre d'état du navigateur pour fermer le menu contextuel et diverses touches de raccourci. Cependant, un double-clic sur l'icône dans le coin supérieur du navigateur pour fermer le navigateur et fermer l'onglet ne peut pas être surveillé.

Ce qui précède représente l'intégralité du contenu de cet article. S'il n'est pas bien écrit, veuillez me donner vos précieux avis.