在IE上,我可以用jQuery(非常不标准,但工作)做到这一点
if ($.browser.msie)
$(document).keydown(function(e) { if (e.keyCode == 8) window.event.keyCode = 0;});
但是是否有可能在Firefox上运行,或者在跨浏览器上获得额外的好处呢?
郑重声明:
$(document).keydown(function(e) { if (e.keyCode == 8) e.stopPropagation(); });
什么也不做。
$(document).keydown(function(e) { if (e.keyCode == 8) e.preventDefault(); });
解决了问题,但使退格键在页面上无法使用,这比原来的行为更糟糕。
编辑:
我这样做的原因是我不是在创建一个简单的网页,而是一个大型的应用程序。仅仅因为你在错误的地方按了退格键而失去了10分钟的工作,这是非常令人恼火的。通过防止退格键返回,防止错误和讨厌用户的比例应该远远超过1000/1。
编辑2:我不是想阻止历史航行,只是想阻止事故。
EDIT3: @brentonstrines评论(因为这个问题太受欢迎了,所以移到这里):这是一个长期的“修复”,但你可以支持Chromium bug来改变webkit中的这种行为
这里的其他答案已经确定,如果没有允许退格的白名单元素,就不能做到这一点。这种解决方案并不理想,因为白名单不像仅仅是文本区域和文本/密码输入那样简单,而且经常被发现是不完整的,需要更新。
However, since the purpose of suppressing the backspace functionality is merely to prevent users from accidentally losing data, the beforeunload solution is a good one because the modal popup is surprising--modal popups are bad when they are triggered as part of a standard workflow, because the user gets used to dismissing them without reading them, and they are annoying. In this case, the modal popup would only appear as an alternative to a rare and surprising action, and is therefore acceptable.
问题是onbeforeunload模式不能在用户导航离开页面时弹出(例如单击链接或提交表单时),而且我们不想开始将特定的onbeforeunload条件列入白名单或黑名单。
对于一个通用的解决方案,折衷的理想组合如下:跟踪是否按下了退格,如果是的话,只弹出onbeforeunload模式。换句话说:
function confirmBackspaceNavigations () {
// http://stackoverflow.com/a/22949859/2407309
var backspaceIsPressed = false
$(document).keydown(function(event){
if (event.which == 8) {
backspaceIsPressed = true
}
})
$(document).keyup(function(event){
if (event.which == 8) {
backspaceIsPressed = false
}
})
$(window).on('beforeunload', function(){
if (backspaceIsPressed) {
backspaceIsPressed = false
return "Are you sure you want to leave this page?"
}
})
} // confirmBackspaceNavigations
这已经在IE7+, FireFox, Chrome, Safari和Opera中进行了测试。只需将这个函数放到global.js中,并从任何您不希望用户意外丢失数据的页面调用它。
注意onbeforeunload模式只能被触发一次,所以如果用户再次按下退格键,该模式将不会再次触发。
注意,这不会触发hashchange事件,但是在这种情况下,您可以使用其他技术来防止用户意外丢失数据。
性能?
我担心性能,做了一个小提琴:http://jsfiddle.net/felvhage/k2rT6/9/embedded/result/
var stresstest = function(e, method, index){...
我已经分析了我在这篇文章中发现的最有前途的方法。事实证明,它们都非常快,而且很可能在输入时不会造成“迟钝”的问题。
我看到的最慢的方法是在IE8中调用10,000次大约125毫秒。也就是0.0125ms / Stroke。
我发现Codenepal和Robin Maben发布的方法是最快的~ 0.001ms (IE8),但要注意不同的语义。
也许这对于在代码中引入这种功能的人来说是一种解脱。