Je souhaite désactiver l'actualisation du navigateur à l'aide de JavaScript.
Actuellement, j'utilise window.onbeforeunload
et je ne veux pas qu'il soit appelé lorsque l'utilisateur actualise le navigateur.
Quelle est la meilleure façon de le faire?
Mise à jour Un commentaire récent affirme que cela ne fonctionne pas dans le nouveau Chrome ... Comme le montre jsFiddle et testé sur mon site personnel, cette méthode fonctionne toujours à partir de Chrome ver 26.0.1410.64 m
Ceci est vraiment facile dans jQuery en passant:
// slight update to account for browsers not supporting e.which
function disableF5(e) { if ((e.which || e.keyCode) == 116) e.preventDefault(); };
// To disable f5
/* jQuery < 1.7 */
$(document).bind("keydown", disableF5);
/* OR jQuery >= 1.7 */
$(document).on("keydown", disableF5);
// To re-enable f5
/* jQuery < 1.7 */
$(document).unbind("keydown", disableF5);
/* OR jQuery >= 1.7 */
$(document).off("keydown", disableF5);
Sur une note de côté: Cela désactive uniquement le bouton f5 du clavier . Pour vraiment désactiver l'actualisation, vous devez utiliser un script côté serveur pour vérifier les modifications de l'état de la page . Je ne peux pas dire que je sais vraiment comment faire car je ne l’ai pas encore fait.
Sur le site du logiciel sur lequel je travaille, nous utilisons ma fonction disableF5 avec les données de session de Codeigniter. Par exemple, il existe un bouton de verrouillage qui verrouille l'écran et invite la boîte de dialogue Demander un mot de passe. La fonction "disableF5" est rapide et facile et empêche ce bouton de faire quoi que ce soit. Cependant, pour empêcher le clic de la souris sur le bouton d'actualisation, plusieurs choses se produisent.
TIP: Essayez d'utiliser un cookie défini sur le serveur, tel que $_SESSION
de PHP ou même Response.Cookies
de .Net, pour conserver "où" votre client est sur votre site. C'est le plus _ {vanille} _ façon de faire ce que je fais avec la classe Session de CI. La grande différence est que CI utilise une table dans votre base de données, alors que ces méthodes Vanilla stockent un cookie modifiable dans le client. L'inconvénient est qu'un utilisateur peut effacer ses cookies.
Sur le site Enrique posté:
window.history.forward(1);
document.attachEvent("onkeydown", my_onkeydown_handler);
function my_onkeydown_handler() {
switch (event.keyCode) {
case 116 : // 'F5'
event.returnValue = false;
event.keyCode = 0;
window.status = "We have disabled F5";
break;
}
}
pour mac cmd + r, cmd + shift + r à besoin.
function disableF5(e) { if ((e.which || e.keyCode) == 116 || (e.which || e.keyCode) == 82) e.preventDefault(); };
$(document).ready(function(){
$(document).on("keydown", disableF5);
});
var ctrlKeyDown = false;
$(document).ready(function(){
$(document).on("keydown", keydown);
$(document).on("keyup", keyup);
});
function keydown(e) {
if ((e.which || e.keyCode) == 116 || ((e.which || e.keyCode) == 82 && ctrlKeyDown)) {
// Pressing F5 or Ctrl+R
e.preventDefault();
} else if ((e.which || e.keyCode) == 17) {
// Pressing only Ctrl
ctrlKeyDown = true;
}
};
function keyup(e){
// Key up Ctrl
if ((e.which || e.keyCode) == 17)
ctrlKeyDown = false;
};
$(window).bind('beforeunload', function(e) {
return "Unloading this page may lose data. What do you want to do..."
e.preventDefault();
});
C'est le code que j'utilise pour désactiver l'actualisation sur IE et Firefox (cela fonctionne bien pour F5, Ctr + F5 et Ctrl + R)
<script language="javascript" type="text/javascript">
//this code handles the F5/Ctrl+F5/Ctrl+R
document.onkeydown = checkKeycode
function checkKeycode(e) {
var keycode;
if (window.event)
keycode = window.event.keyCode;
else if (e)
keycode = e.which;
// Mozilla firefox
if ($.browser.mozilla) {
if (keycode == 116 ||(e.ctrlKey && keycode == 82)) {
if (e.preventDefault)
{
e.preventDefault();
e.stopPropagation();
}
}
}
// IE
else if ($.browser.msie) {
if (keycode == 116 || (window.event.ctrlKey && keycode == 82)) {
window.event.returnValue = false;
window.event.keyCode = 0;
window.status = "Refresh is disabled";
}
}
}
</script>
Si vous ne souhaitez pas utiliser useragent pour détecter le type de navigateur utilisé ($ .browser utilise navigator.userAgent pour déterminer la plate-forme), vous pouvez utiliser
if('MozBoxSizing' in document.documentElement.style)
- retourne vrai pour firefox
Utilisez ceci pour les navigateurs modernes:
function my_onkeydown_handler( event ) {
switch (event.keyCode) {
case 116 : // 'F5'
event.preventDefault();
event.keyCode = 0;
window.status = "F5 disabled";
break;
}
}
document.addEventListener("keydown", my_onkeydown_handler);
Si vous utilisez JSF, vous pouvez directement utiliser le raccourci clavier provenant de visages riches.
<rich:hotKey key="backspace" onkeydown="if (event.keyCode == 8) return false;" handler="return false;" disableInInput="true" />
<rich:hotKey key="f5" onkeydown="if (event.keyCode == 116) return false;" handler="return false;" disableInInput="true" />
<rich:hotKey key="ctrl+R" onkeydown="if (event.keyCode == 123) return false;" handler="return false;" disableInInput="true" />
<rich:hotKey key="ctrl+f5" onkeydown="if (event.keyCode == 154) return false;" handler="return false;" disableInInput="true" />
Cela fonctionne pour moi dans tous les navigateurs:
document.onkeydown = function(){
switch (event.keyCode){
case 116 : //F5 button
event.returnValue = false;
event.keyCode = 0;
return false;
case 82 : //R button
if (event.ctrlKey){
event.returnValue = false;
event.keyCode = 0;
return false;
}
}
}
Si vous souhaitez désactiver ctrl + f5, ctrl + r, f5, retour arrière, vous pouvez utiliser ce code simple. Ce code fonctionne dans Mozila ainsi que dans Chrome. Ajoutez ce code dans votre balise body:
<body onkeydown="return (event.keyCode == 154)">