web-dev-qa-db-fra.com

Désactiver F5 et rafraîchir le navigateur en utilisant JavaScript

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?

55
Salil

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:

 

jsFiddle

// 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. 

  1. Lorsque vous cliquez sur verrouiller, les données de session utilisateur ont une variable appelée "verrouillée" qui devient TRUE
  2. Lorsque le bouton d'actualisation est cliqué, la méthode de chargement de la page maître permet d'effectuer une vérification des données de session pour "verrouillé", si VRAI, nous interdisons simplement la redirection et la page ne change jamais, quelle que soit la destination demandée.

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.

79
SpYk3HH

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;
    }
}
8
kzh

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);
});
8
gokhan
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;
};
7
Jos
$(window).bind('beforeunload', function(e) { 
    return "Unloading this page may lose data. What do you want to do..."
    e.preventDefault();
});
6
Hla Min Swe

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

4
Saurav S.

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);
2
Orhun Alp Oral

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" /> 
0
pratik

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;
            }
    }
}
0
Albert Maristany

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)">