Comment puis-je détecter un rafraîchissement de page en utilisant jquery?
Comment puis-je capturer l'événement de rechargement de page?
j'ai un système de messagerie qui perd toutes ses entrées lorsque l'utilisateur actualise la page. Je veux utiliser ajax pour recharger, d'où mon besoin de détecter quand la page a été rafraîchie/rechargée.
4 réponses
$('body').bind('beforeunload',function(){
//do something
});
mais cela ne sauvera aucune information pour plus tard, à moins que vous ayez prévu de sauvegarder cela dans un cookie quelque part (ou un stockage local) et le unload
l'événement ne se déclenche pas toujours dans tous les navigateurs.
exemple:http://jsfiddle.net/maniator/qpK7Y/
Code:
$(window).bind('beforeunload',function(){
//save info somewhere
return 'are you sure you want to leave?';
});
si vous voulez réserver une variable avant de rafraîchir la page
$(window).on('beforeunload', function(){
// your logic here
});
si vous voulez o charger le contenu de la base sur une condition
$(window).on('load', function(){
// your logic here`enter code here`
});
Tout le code est côté client, j'espère que vous affiner ce utile:
première chose il y a 3 fonctions que nous utiliserons:
function setCookie(c_name, value, exdays) {
var exdate = new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value = escape(value) + ((exdays == null) ? "" : "; expires=" + exdate.toUTCString());
document.cookie = c_name + "=" + c_value;
}
function getCookie(c_name) {
var i, x, y, ARRcookies = document.cookie.split(";");
for (i = 0; i < ARRcookies.length; i++) {
x = ARRcookies[i].substr(0, ARRcookies[i].indexOf("="));
y = ARRcookies[i].substr(ARRcookies[i].indexOf("=") + 1);
x = x.replace(/^\s+|\s+$/g, "");
if (x == c_name) {
return unescape(y);
}
}
}
function DeleteCookie(name) {
document.cookie = name + '=; expires=Thu, 01-Jan-70 00:00:01 GMT;';
}
nous allons maintenant commencer avec le chargement de la page:
$(window).load(function () {
//if IsRefresh cookie exists
var IsRefresh = getCookie("IsRefresh");
if (IsRefresh != null && IsRefresh != "") {
//cookie exists then you refreshed this page(F5, reload button or right click and reload)
//SOME CODE
DeleteCookie("IsRefresh");
}
else {
//cookie doesnt exists then you landed on this page
//SOME CODE
setCookie("IsRefresh", "true", 1);
}
})
Il y a deux événements côté client comme indiqué ci-dessous.
1. fenêtre.onbeforeunload (appels sur le Navigateur internet/onglet Fermer Et de Chargement de la Page)
2. fenêtre.onload (appels au Chargement de la Page)
Côté serveur
public JsonResult TestAjax( string IsRefresh)
{
JsonResult result = new JsonResult();
return result = Json("Called", JsonRequestBehavior.AllowGet);
}
Du Côté Du Client
<script type="text/javascript">
window.onbeforeunload = function (e) {
$.ajax({
type: 'GET',
async: false,
url: '/Home/TestAjax',
data: { IsRefresh: 'Close' }
});
};
window.onload = function (e) {
$.ajax({
type: 'GET',
async: false,
url: '/Home/TestAjax',
data: {IsRefresh:'Load'}
});
};
</script>
Sur Le Navigateur Internet/Onglet À Proximité: si l'utilisateur ferme le navigateur / onglet, puis fenêtre.onbeforeunload va la valeur fire et IsRefresh du côté du serveur sera"Close".
Sur "Rafraîchir" /F5: Si l'utilisateur va rafraîchir la page, première fenêtre.onbeforeunload tirera avec la valeur IsRefresh = "Close" puis window.onload va tirer avec la valeur IsRefresh = "Load", donc maintenant vous pouvez déterminer enfin que votre page est rafraîchissante.