关于屏蔽浏览器退格键的几个尝试

时间 2019-11-11

标签关于屏蔽浏览器退格键几个尝试栏目浏览器繁體版

原文原文链接

大部分浏览器在浏览网页时，按退格键（BackSpace）会触发后退操做。但我但愿尝试下如何屏蔽此功能。html

我使用的操做系统为Win7，我用于测试的三个浏览器版本信息以下：node

一、Internet Exlorer 8.0.7601.17514（后面简称IE8）浏览器

二、Google Chrome 50.0.2661.102 m（后面简称Chrome）session

三、Firefox 46.0.1（后面简称Firefox）测试

从网上搜集的资料代表，能够经过添加js代码的方式屏蔽退格键。spa

若有页面page1.html代码以下：操作系统

<html>
  <head>
    <title>测试页面1</title>
  </head>
  <body>
    <input type="button" id="openNewPage" value="打开新页面" onclick="openNewPage();" />
    <script>
      function openNewPage() {
        window.location.href = "file:///C:/Users/Tsybius/Desktop/ShieldBpTest/page2.html";
      }
    </script>
  </body>
</html>

该页面能够打开另外一个页面page2.html：code

<html>
  <head>
    <title>测试页面2</title>
  </head>
  <body>
    <p>这是一张测试页面</p>
    <input type="text" id="testText" />
    <script>
        //参考自 http://q821424508.iteye.com/blog/1587025
        window.onload = function() {  
            if (navigator.userAgent.indexOf('Firefox') >= 0) {
                alert("检测到您正使用火狐浏览器，请将 about:config 中 browser.backspace_action 设置为 2");
                return;
            }
            document.getElementsByTagName("body")[0].onkeydown = function() {
                if(event.keyCode==8) {
                    var elem = event.srcElement || event.currentTarget;
                    var name = elem.nodeName;
                    if(name!='INPUT' && name!='TEXTAREA') {
                        return _stopIt(event);  
                    }  
                    var type_e = elem.type.toUpperCase();  
                    if(name=='INPUT' && (type_e!='TEXT' && type_e!='TEXTAREA' && type_e!='PASSWORD' && type_e!='FILE')) {
                        return _stopIt(event);  
                    }  
                    if(name=='INPUT' && (elem.readOnly==true || elem.disabled ==true)){  
                        return _stopIt(event);  
                    }  
                }  
            };
        };
        function _stopIt(e) {  
            if(e.returnValue) {  
                e.returnValue = false ;  
            }  
            if(e.preventDefault){  
                e.preventDefault();  
            }
            return false;  
        }  
    </script>
  </body>
</html>

这个方式通过试验，经过点击page1的按钮进入到page2后，在page2按下退格键，若是当前焦点在文本输入框中则可进行正常的删除，不然并不会触发退后功能。不过这个方法适用于Chrome和IE8，在Firefox的试验并无成功。htm

这个问题网上有人说是由于Firefox用了W3C DOM，而IE用的是IE DOM。但即便用了变通的办法获取到了Firefox的event，也没法阻止退格键对页面的后退。blog

再后来，我发现了Firefox自己就提供了一个屏蔽退格键的功能。进入Firefox的about:config页面，找到属性browser.backspace_action，这个属性的介绍能够参考页面：

http://kb.mozillazine.org/Browser.backspace_action

这个属性的值，有0、一、其余三类取值：

0：按下Backspace键后会返回session历史中上一个打开的页面，按下Shift+Backspace键反之。（Windows系统默认）

1：按下Backspace键后会在当前页的基础上向上滚动一页，按下Shift+Backspace键反之。（2006年12月7日之前编译的Linux默认）

其余：填写其余任何整数值都会屏蔽BackSpace键。（2006年12月7日之后编译的Linux版本，默认值为2）

将这个配置项设为2，就能够屏蔽掉Firefox浏览器的BackSpace快捷键了。

END