`

JS禁用浏览器退格键

阅读更多

 

我们在真实的项目开发中经常会使用JS 对键盘上的一些按键进行禁用,常见的比如说退格键(backspace/ 后退键),我在一个项目中就遇到过在页面编辑的时候禁用掉退格键,因为退格键会发生页面后退,这样编辑的内容都会失去了,非常的恶心人。ok ,废话少说,直接上代码。

  <script type="text/javascript">
        //处理键盘事件 禁止后退键(Backspace)密码或单行、多行文本框除外
        function forbidBackSpace(e) {
            var ev = e || window.event; //获取event对象 
            var obj = ev.target || ev.srcElement; //获取事件源 
            var t = obj.type || obj.getAttribute('type'); //获取事件源类型 
            //获取作为判断条件的事件类型 
            var vReadOnly = obj.readOnly;
            var vDisabled = obj.disabled;
            //处理undefined值情况 
            vReadOnly = (vReadOnly == undefined) ? false : vReadOnly;
            vDisabled = (vDisabled == undefined) ? true : vDisabled;
            //当敲Backspace键时,事件源类型为密码或单行、多行文本的, 
            //并且readOnly属性为true或disabled属性为true的,则退格键失效 
            var flag1 = ev.keyCode == 8 && (t == "password" || t == "text" || t == "textarea") && (vReadOnly == true || vDisabled == true);
            //当敲Backspace键时,事件源类型非密码或单行、多行文本的,则退格键失效 
            var flag2 = ev.keyCode == 8 && t != "password" && t != "text" && t != "textarea";
            //判断 
            if (flag2 || flag1) return false;
        }
        //禁止后退键 作用于Firefox、Opera
        document.onkeypress = forbidBackSpace;
        //禁止后退键  作用于IE、Chrome
        document.onkeydown = forbidBackSpace;
</script>

 

Ok ,下面需要做几点说明:

      1 、可能有的人没有考虑到页面的中有一个不可编辑的输入框的时候,如果光标在此输入框中,敲退格键的时候依然会发生后退;

      2 、有的人可能在获取作为判断条件的事件类型的时候是通过

  var vReadOnly = obj.getAttribute('readonly');  

  var vEnabled = obj.getAttribute('enabled');  

这样的话  FirefoxChrome obj.getAttribute('readonly') 返回的值是null,"", 而在IE, 该方法返回的是"readonly""", 而且根据测试,  
并没有"enable" 的属性, 而应该是"disabled", 因此, 上述方法固然会失效. 而且获取DOM 的对象属性及标准属性的时候, 不应该采用getAttribute 方法, 这是不准确的, 应采用obj.attribute 标准方法, 这样不会存在因浏览器对js 的解释差异而导致的兼容性问题

 

其实如果大家注意看上面的代码可以发现,通过这种方式我们可以禁用键盘上的的所有按键,只要找到对应的 keyCode 即可。

 

PS:新年好!

 

 

 

4
0
分享到:
评论
3 楼 arcpad 2014-12-06  
             
2 楼 arcpad 2014-12-06  
   
1 楼 tc_xiao 2013-05-14  
Good,

相关推荐

    JS禁用浏览器退格键实现思路及代码

    针对这个问题,本文将介绍如何使用JavaScript(JS)来禁用浏览器的退格键功能,以满足特定的业务需求。 首先,实现禁用退格键的基本思路是通过JavaScript监听键盘事件,并在用户尝试通过退格键删除信息时进行拦截。...

    JS 禁用 退格-刷新-禁用地址栏-菜单栏-右键-窗口最大化

    1. **禁用退格键**: 在网页中,用户按下退格键通常会返回上一个浏览的历史页面。然而,通过JS可以监听键盘事件来阻止这一默认行为。例如,你可以监听`keydown`事件,并检查是否是退格键(键码127或`event.key`为...

    js禁止使用退格键

    ### 禁止使用退格键的JavaScript实现 在网页应用开发中,有时为了保护用户数据的安全性或防止误操作,我们需要对用户的某些输入行为进行限制。比如,在表单填写过程中,可能不希望用户能够通过退格键(Backspace)...

    javascript禁用退格和回车键

    javascript编写的禁用退格和回车键,兼容所有主流的浏览器,ie6,7,8,9,10 FireFox,谷歌。

    jquery+js两种方式实现的禁止退格键回退

    标题提到的“jquery+js两种方式实现的禁止退格键回退”主要涉及JavaScript和jQuery这两种方法来阻止浏览器响应退格键的行为。下面将详细介绍这两种实现方式。 首先,我们来看JavaScript原生的方法: 1. **监听键盘...

    javascript怎么禁用浏览器后退按钮

    接下来将详细介绍如何使用JavaScript禁用浏览器后退按钮。 1. 使用`window.history.forward(1);`方法 通过执行`window.history.forward(1);`命令,可以使浏览器窗口的浏览历史记录前进一页,相当于模拟用户点击了...

    js屏蔽退格键(backspace或者叫后退键与F5)

    可以在页面加载时调用window.history.forward(1),这样即使用户按下退格键,浏览器也不会回退到前一页,因为JavaScript已经让浏览器前进到了后一页。 在实际应用中,屏蔽退格键并不是一个推荐的做法,因为它可能会...

    js 禁用只读文本框获得焦点时的退格键

    为了解决这个问题,我们可以编写一段JavaScript代码来禁用只读文本框在获得焦点时的退格键功能。以下是一个简单的实现方案: ```javascript document.documentElement.onkeydown = function(evt) { var b = !!evt,...

    javascript禁用键盘功能键让右击及其他键无效.docx

    例如,以下代码展示了如何屏蔽F5刷新键、Ctrl+R组合键以及退格键: ```javascript document.onkeydown = function (e) { if (e.keyCode === 116 || // F5 (e.ctrlKey && e.keyCode === 82)) { // Ctrl+R e....

    JQuery防止退格键网页后退的实现代码

    在网页开发中,有时我们需要禁用用户使用浏览器的退格键(Backspace)来防止其触发页面后退的行为,特别是在用户进行数据输入或者操作时,误按退格键导致页面跳转可能会造成不便或数据丢失。这篇内容主要讨论的是...

    JQuery实现防止退格键返回的方法

    为了防止退格键(Backspace)导致浏览器返回上一页的行为,我们需要绑定键盘按下(keydown)事件,并在事件处理函数中判断按键的代码(keyCode)。退格键的keyCode值为8。通过判断当前事件的目标元素(target),...

    各种禁止键盘的经典JS

    - 还添加了回车键(13)、退格键(8)的按键码。 2. **判断按键合法性**: - 通过遍历`allowKeyCodeArray`,检查触发`keydown`事件的按键码是否属于允许列表。 - 如果属于,则`isLegal`变量被设为`true`,允许...

    javascript禁制后退键(Backspace)实例代码.docx

    ### JavaScript禁用后退键(Backspace)实例详解 #### 一、背景介绍 在Web开发过程中,有时候我们需要对用户的操作进行一定的限制,比如在某些特定的表单或输入框中,不允许用户通过按后退键(Backspace)来撤销之前...

    javascript禁用键盘功能键让右击及其他键无效

    例如,以下代码会屏蔽F1键、F5键(刷新)、退格键(Backspace)以及Ctrl+R(重新加载): ```javascript document.onkeydown = function(event) { if (event.keyCode == 8 || // Backspace event.keyCode == ...

    屏蔽鼠标右键、Ctrl+N、Shift+F10、Alt+F4、F11、F5刷新、退格键

    在Web开发中,有时候出于版权保护或者用户体验的考虑,开发者可能会选择禁用浏览器的一些默认行为,比如鼠标右键菜单、快捷键操作等。这些操作可以通过JavaScript来实现。本文将详细介绍如何通过JavaScript来屏蔽...

    js 只接收数字键盘,屏蔽字母区键盘

    - **条件判断**:通过 `if` 语句来检查按键是否为数字、删除键或退格键。 - **返回值**:如果条件满足,则返回 `true` 表示允许输入;否则返回 `false` 表示阻止输入。 - **特殊处理**:这里还包含了一个特殊的条件 ...

    jQuery禁用键盘后退屏蔽F5刷新及禁用右键单击

    如果希望禁用退格键(Backspace)使得用户无法通过按退格键返回上一页,可以使用以下代码: ```javascript $(document).keydown(function (e) { var doPrevent; if (e.keyCode == 8) { var d = e.srcElement |...

Global site tag (gtag.js) - Google Analytics