javascript 在 JQuery 中处理 F5
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4788201/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Handling F5 in JQuery
提问by Chev
I have a site where I would like to override F5 so that it doesn't refresh the page, but instead executes some ajax calls to refresh certain pieces. Is this possible?
我有一个网站，我想覆盖 F5，这样它就不会刷新页面，而是执行一些 ajax 调用来刷新某些部分。这可能吗？
EDIT:Because none of you seem to understand why I would want to do something like this, if you are genuinely interested then visit these links:
编辑：因为你们似乎都不明白为什么我想做这样的事情，如果你真的感兴趣，请访问这些链接：
Open-source project (simple web-terminal): http://code.google.com/p/web-terminal
开源项目（简单的网络终端）：http: //code.google.com/p/web-terminal
Running demo of simple web-terminal: http://web-terminal.net.pine.arvixe.com
运行简单网络终端的演示：http: //web-terminal.net.pine.arvixe.com
Live implementation (The forum version): http://www.u413.com
现场执行（论坛版）：http: //www.u413.com
回答by jAndy
Well, you coulddo that (at least in some browsers, I'm not sure if this works cross-browser), but it reaaalllly would be a pretty bad user experience.
好吧，你可以这样做（至少在某些浏览器中，我不确定这是否可以跨浏览器工作），但这确实会是一个非常糟糕的用户体验。
$(document).bind('keypress keydown keyup', function(e) {
if(e.which === 116) {
console.log('blocked');
return false;
}
if(e.which === 82 && e.ctrlKey) {
console.log('blocked');
return false;
}
});
Anyway, even if that works, there are other ways for an user to refresh the site. Pressing ctrl + r(cmd + r) or just hit the refresh button. Well, the other hot-key combination can get blocked similar, but no way to block the refresh button.
无论如何，即使有效，用户也可以通过其他方式刷新站点。按ctrl + r( cmd + r) 或直接点击刷新按钮。好吧，其他的热键组合也可以类似的被屏蔽，但是没办法屏蔽刷新按钮。
--
——
It's maybe a huge better idea not to block those default browser behaviors, but to ask gracefully. That can be done by binding an event handler to the onbeforeunloadevent, which fires before a site is unloaded.
最好不要阻止那些默认的浏览器行为，而是优雅地询问。这可以通过将事件处理程序绑定到事件来完成，该onbeforeunload事件在卸载站点之前触发。
$(window).bind('beforeunload', function() {
return 'Are you really sure?';
});
回答by nomis
This is the same as the accepted answer above, except without capturing the 'keypress' event.
这与上面接受的答案相同，除了没有捕获 'keypress' 事件。
If you capture the 'keypress' event, you also block the 't' key. For some reason both the keycode and ASCII keycode are both captured if you use the 'keypress' event (which you can't see in the chrome debugger). The F5 key is '116', but the ASCII keycode for 't' is also 116, so with the 'keypress' event you block F5, but you also block 't' app-wide.
如果您捕获了 'keypress' 事件，您也会阻止 't' 键。出于某种原因，如果您使用 'keypress' 事件（您在 Chrome 调试器中看不到），则键码和 ASCII 键码都会被捕获。F5 键是 '116'，但 't' 的 ASCII 键码也是 116，所以使用 'keypress' 事件可以阻止 F5，但也可以阻止整个应用程序中的 't'。
$(document).bind('keydown keyup', function(e) {
if(e.which === 116) {
console.log('blocked');
return false;
}
if(e.which === 82 && e.ctrlKey) {
console.log('blocked');
return false;
}
});
Here's the coffeescript just for fun :)
这是咖啡脚本只是为了好玩:)
$(document).bind "keydown keyup", (e) ->
if e.keyCode is 116
console.log "blocked"
return false
if e.keyCode is 82 and e.ctrlKey
console.log "blocked"
false
回答by Vlad
Here's one example on how overriding the F5 key will enhance user experience. I'm building the newsletter editor for my client and I need to prevent the page from reloading when user accidentally presses F5 key but instead it refreshes email preview created from entered html code.
下面是一个示例，说明覆盖 F5 键将如何增强用户体验。我正在为我的客户构建时事通讯编辑器，当用户不小心按下 F5 键时，我需要防止页面重新加载，但它会刷新根据输入的 html 代码创建的电子邮件预览。
