使用JavaScript禁用F5和浏览器刷新

更新 最近有评论称这在新的Chrome中不起作用。。。如jsFiddle所示,并在我的个人网站上进行了测试,这个方法在Chrome版本中仍然有效 26.0.1410.64 m

顺便说一下,这在jQuery中非常简单:

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

旁注: 这只会禁用键盘上的f5按钮。 要真正禁用刷新,必须使用服务器端脚本检查页面状态更改。 不能说我真的知道怎么做,因为我还没做。

在我工作的软件站点上,我们将disableF5函数与Codeigniter的会话数据结合使用。例如,有一个锁定按钮,它将锁定屏幕并提示密码对话框。功能“disableF5”是快速和简单的,并保持按钮从做任何事情。但是,为了防止鼠标单击刷新按钮,会发生一些事情。

1. 单击lock时,用户会话数据有一个名为“locked”的变量变为TRUE
2. 单击刷新按钮时,母版页加载方法会检查会话数据是否“锁定”,如果为TRUE,则不允许重定向,并且无论请求的目标是什么,页面都不会更改

提示: 尝试使用服务器集cookie,例如PHP $_SESSION ,甚至.Net的 Response.Cookies 就像我在CI的课程里做的那样。最大的区别是CI在DB中使用一个表,而 香草 方法在客户机中存储可编辑的cookie。但缺点是,用户可以清除cookies。

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.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;
    }
}

对于mac cmd+r,需要cmd+shift+r。

function disableF5(e) { if ((e.which || e.keyCode) == 116 || (e.which || e.keyCode) == 82) e.preventDefault(); };

$(document).ready(function(){
$(document).on("keydown", disableF5);
});

$(window).bind('beforeunload', function(e) { 
    return "Unloading this page may lose data. What do you want to do..."
    e.preventDefault();
});

在现代浏览器中使用此选项:

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

这是我用来在IE和firefox上禁用刷新的代码,适用于以下组合键:

F5级 | + F5级 | +

//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";
        }
    }
}

如果您不想使用useragent来检测它是什么类型的浏览器( $.browser navigator.userAgent 要确定平台),可以使用

if('MozBoxSizing' in document.documentElement.style)

在所有浏览器中都适用:

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

在纯JS中输入以下简单脚本:

document.addEventListener('keydown', (e) => {
    e = e || window.event;
    if(e.keyCode == 116){
        e.preventDefault();
    }
});

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

如果要禁用ctrl+f5、ctrl+R、f5和backspace,那么可以使用以下简单代码。这段代码在Mozila和Chrome中都可以使用。在body标签中添加以下代码:

<body onkeydown="return (event.keyCode == 154)">