转载至JS过滤BackSpace
我们在真实的项目开发中经常会使用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');
这样的话在Firefox及Chrome中 obj.getAttribute('readonly') 返回的值是null,或"",而在IE中,该方法返回的是"readonly"或"",而且根据测试,
并没有"enable"的属性,而应该是"disabled",因此,上述方法固然会失效.而且获取DOM的对象属性及标准属性的时候,不应该采用getAttribute方法,这是不准确的,应采用obj.attribute标准方法,这样不会存在因浏览器对js的解释差异而导致的兼容性问题;
其实如果大家注意看上面的代码可以发现,通过这种方式我们可以禁用键盘上的的所有按键,只要找到对应的keyCode即可。
分享到:
相关推荐
针对这个问题,本文将介绍如何使用JavaScript(JS)来禁用浏览器的退格键功能,以满足特定的业务需求。 首先,实现禁用退格键的基本思路是通过JavaScript监听键盘事件,并在用户尝试通过退格键删除信息时进行拦截。...
1. **禁用退格键**: 在网页中,用户按下退格键通常会返回上一个浏览的历史页面。然而,通过JS可以监听键盘事件来阻止这一默认行为。例如,你可以监听`keydown`事件,并检查是否是退格键(键码127或`event.key`为...
### 禁止使用退格键的JavaScript实现 在网页应用开发中,有时为了保护用户数据的安全性或防止误操作,我们需要对用户的某些输入行为进行限制。比如,在表单填写过程中,可能不希望用户能够通过退格键(Backspace)...
javascript编写的禁用退格和回车键,兼容所有主流的浏览器,ie6,7,8,9,10 FireFox,谷歌。
标题提到的“jquery+js两种方式实现的禁止退格键回退”主要涉及JavaScript和jQuery这两种方法来阻止浏览器响应退格键的行为。下面将详细介绍这两种实现方式。 首先,我们来看JavaScript原生的方法: 1. **监听键盘...
接下来将详细介绍如何使用JavaScript禁用浏览器后退按钮。 1. 使用`window.history.forward(1);`方法 通过执行`window.history.forward(1);`命令,可以使浏览器窗口的浏览历史记录前进一页,相当于模拟用户点击了...
可以在页面加载时调用window.history.forward(1),这样即使用户按下退格键,浏览器也不会回退到前一页,因为JavaScript已经让浏览器前进到了后一页。 在实际应用中,屏蔽退格键并不是一个推荐的做法,因为它可能会...
为了解决这个问题,我们可以编写一段JavaScript代码来禁用只读文本框在获得焦点时的退格键功能。以下是一个简单的实现方案: ```javascript document.documentElement.onkeydown = function(evt) { var b = !!evt,...
例如,以下代码展示了如何屏蔽F5刷新键、Ctrl+R组合键以及退格键: ```javascript document.onkeydown = function (e) { if (e.keyCode === 116 || // F5 (e.ctrlKey && e.keyCode === 82)) { // Ctrl+R e....
在网页开发中,有时我们需要禁用用户使用浏览器的退格键(Backspace)来防止其触发页面后退的行为,特别是在用户进行数据输入或者操作时,误按退格键导致页面跳转可能会造成不便或数据丢失。这篇内容主要讨论的是...
为了防止退格键(Backspace)导致浏览器返回上一页的行为,我们需要绑定键盘按下(keydown)事件,并在事件处理函数中判断按键的代码(keyCode)。退格键的keyCode值为8。通过判断当前事件的目标元素(target),...
- 还添加了回车键(13)、退格键(8)的按键码。 2. **判断按键合法性**: - 通过遍历`allowKeyCodeArray`,检查触发`keydown`事件的按键码是否属于允许列表。 - 如果属于,则`isLegal`变量被设为`true`,允许...
### JavaScript禁用后退键(Backspace)实例详解 #### 一、背景介绍 在Web开发过程中,有时候我们需要对用户的操作进行一定的限制,比如在某些特定的表单或输入框中,不允许用户通过按后退键(Backspace)来撤销之前...
例如,以下代码会屏蔽F1键、F5键(刷新)、退格键(Backspace)以及Ctrl+R(重新加载): ```javascript document.onkeydown = function(event) { if (event.keyCode == 8 || // Backspace event.keyCode == ...
在Web开发中,有时候出于版权保护或者用户体验的考虑,开发者可能会选择禁用浏览器的一些默认行为,比如鼠标右键菜单、快捷键操作等。这些操作可以通过JavaScript来实现。本文将详细介绍如何通过JavaScript来屏蔽...
- **条件判断**:通过 `if` 语句来检查按键是否为数字、删除键或退格键。 - **返回值**:如果条件满足,则返回 `true` 表示允许输入;否则返回 `false` 表示阻止输入。 - **特殊处理**:这里还包含了一个特殊的条件 ...
如果希望禁用退格键(Backspace)使得用户无法通过按退格键返回上一页,可以使用以下代码: ```javascript $(document).keydown(function (e) { var doPrevent; if (e.keyCode == 8) { var d = e.srcElement |...