`
NORRET
  • 浏览: 9348 次
  • 性别: Icon_minigender_1
  • 来自: 潍坊
社区版块
存档分类
最新评论

BaskSpace键控制

    博客分类:
  • js
js 
阅读更多
//处理键盘事件 禁止后退键(Backspace)密码或单行、多行文本框除外
function noBackSpace(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;
}


[color=darkred]readonly 和 disable的区别

Readonly和Disabled它们都能够做到使用户不能够更改表单域中的内容。但是它们之间有着微小的差别,总结如下:

     Readonly只针对input(text / password)和textarea有效,而disabled对于所有的表单元素都有效,但是表单元素在使用了disabled后,当我们将表单以POST或GET的方式提交的话,这个元素的值不会被传递出去,而readonly会将该值传递出去(readonly接受值更改可以回传,disable接受改但不回传数据)。



一般比较常用的情况是:

在某个表单中为用户预填了某个唯一识别代码,不允许用户改动,但是在提交时需要传递该值,此时应该将它的属性设置为readonly 。
经常遇到当用户正式提交了表单后需要等待管理员的信息验证,这就不允许用户再更改表单中的数据,而是只能够查看,由于disabled的作用元素范围大,所以此时应该使用disabled,但同时应该注意的是要将submit button也disabled掉,否则只要用户按了这个按钮,如果在数据库操作页面中没有做完整性检测的话,数据库中的值就会被清除。如果说在这种情况下用readonly来代替disabled的话,若表单中只有input(text / password)和textarea元素,那还是可以的,如果存在其他发元素,比如select,用户可以在重新改写值后按回车键进行提交(回车是默认的submit触发按键)
我们常常在用户按了提交按钮后,利用javascript将提交按钮disabled掉,这样可以防止网络条件比较差的环境下,用户反复点提交按钮导致数据冗余地存入数据库。
disabled和readonly这两个属性有一些共同之处,比如都设为true,则form属性将不能被编辑,往往在写js代码的时候容易混合使用这两个属性,其实他们之间是有一定区别的:

如果一个输入项的disabled设为true,则该表单输入项不能获取焦点,用户的所有操作(鼠标点击和键盘输入等)对该输入项都无效,最重要的一点是当提交表单时,这个表单输入项将不会被提交。
而readonly只是针对文本输入框这类可以输入文本的输入项,如果设为true,用户只是不能编辑对应的文本,但是仍然可以聚焦焦点,并且在提交表单的时候,该输入项会作为form的一项提交。
分享到:
评论

相关推荐

    禁用backspace键的后退功能

    在探讨如何禁用backspace键的后退功能之前,我们首先需要理解backspace键在不同情境下的作用。在文本编辑环境中,backspace键主要用于删除光标左侧的字符,而在网页浏览过程中,按下backspace键可能会触发浏览器的...

    js禁止Backspace键使浏览器后退的实现方法.docx

    Backspace键的功能通常由浏览器的默认行为控制。通过监听键盘事件(如`keydown`或`keypress`),可以捕获Backspace键的触发,并通过特定的方法阻止其默认行为,进而实现禁止Backspace键使浏览器后退的目的。 #### ...

    北京盈科(沈阳)律师事务所员工素质培训资料之PPT制作技巧.doc

    B或“.”键显示和取消黑屏,W或“,”键显示和取消白屏,CTRL+H隐藏鼠标指针,CTRL+A显示鼠标,同时按住鼠标左右键2秒以上回到第一张幻灯片,以及使用空格键和Backspace键控制自动放映的暂停和继续。 掌握这些技巧...

    js禁止Backspace键使浏览器后退的实现方法

    一个常见的解决方案是禁止用户通过键盘上的Backspace键后退页面,这可以通过JavaScript来实现。 首先,我们需要编写一个函数来阻止Backspace键的默认行为。这个函数名为`banBackSpace`,它接收一个事件对象作为参数...

    web 屏蔽BackSpace键实例代码

    总的来说,这段代码提供了在特定情况下屏蔽网页中Backspace键的方法,以防止意外的页面回退,特别适用于需要精细控制用户输入体验的场景。然而,需要注意的是,这种做法可能会影响到用户正常的浏览习惯,因此在实际...

    js屏蔽backspace后退,又不影响删除输入框文字

    对于`Backspace`键的操作,我们可以根据当前焦点所在元素的类型以及是否可编辑来决定是否允许其执行删除操作,同时避免触发浏览器的默认后退行为。这种技术不仅适用于特定场景,还可以应用于多种前端项目中,提升...

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

    在Web开发中,通常会遇到需要屏蔽浏览器默认行为的场景,比如在编辑文章的页面中屏蔽用户按退格键(Backspace)或F5刷新页面,以免造成正在编辑的内容丢失。尤其是退格键,它不仅会删除文本框中的字符,还会导致...

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

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

    计算机基础-认识键盘.ppt

    * 光标控制区:包括光标移动键、删除键、Home键、End键等,这些键可以控制光标的移动和删除操作。 * 功能键区:包括F1-F12键、Esc键、Tab键等,这些键可以执行各种功能,如打开文件、关闭窗口、切换程序等。 * 小...

    计算机应用基础教程-认识键盘PPT课件.ppt

    在知识目标中,重点提到了主键盘区的四个控制键:Enter键、Backspace键、Shift键和Caps Lock键。Enter键,又称为回车键,常用于确认选择或结束输入;Backspace键是退格键,用于删除前一个字符;Caps Lock键是大小写...

    键盘上的CtrlAltShift等键的读音与用途.doc

    七、Backspace键(退格键):读音为[百科四怕死],Backspace键的主要用途是删除光标前的字符。 八、Num Lock键(数字锁开关键):读音为[喽(lou)喏克],Num Lock键的主要用途是开启或关闭数字键盘。 九、Pg Up键...

    键盘教案.doc

    - Shift和Backspace键的正确使用场景。 3. **教学过程** - 引导学生通过观看视频激发学习兴趣,了解键盘的重要性。 - 讲解键盘的四大部分:主键盘区、光标控制区、小键盘区和功能键区,强调每个区域的功能。 - ...

    计算机应用基础教程认识键盘PPT学习教案.pptx

    2. Backspace键(退格键):用于删除光标前的一个字符,常用于纠正输入错误。 3. Caps Lock键(大小写字母锁定键):按下后,可以使接下来输入的所有字母变为大写,再次按下则恢复为小写。 4. Shift键(上下档字符...

    计算机应用基础教程认识键盘ppt课件.ppt

    此外,Shift键与Backspace键的配合使用可能需要额外的练习,因为Backspace键并不受Shift键的影响,仍能正常删除字符。 在“写字板”或其他文本编辑软件中正确输入字符,需要掌握基本的打字技巧,如指法,即每个手指...

    键盘按键命令

    可将 application键用于 microsoft自然键盘或含有 application键的其他兼容键 七、microsoft放大程序的快捷键 这里运用windows徽标键和其他键的组合。 快捷键目的 windows徽标+print screen将屏幕复制到剪贴...

    键盘按钮对应代码

    从这份文档中,我们可以深入了解到电脑键盘上各个按键所对应的按键码(Keycode),这对于理解键盘输入、编程控制以及在特定场景下(如玩经典游戏)进行按键映射具有重要意义。以下是对文档中提及的按键及其代码的...

    键盘与鼠标按键的键值对照表.docx

    - **十进制值**:这是按键在计算机内部以十进制形式表示的数值,例如`VK_BACK`的十进制值为88,对应于Backspace键。 - **十六进制值**:与十进制值相对应,十六进制值在某些编程语言中更常见,如`VK_RBUTTON`的...

    计算机应用基础教程认识键盘PPT课件.pptx

    同时,Shift键和Backspace键的配合使用也是需要掌握的技巧,例如在需要连续删除多个字符时。 了解和熟练掌握这些基本的键盘操作,不仅能够提高输入效率,还能为后续更复杂的计算机操作打下坚实的基础。在“写字板”...

    解决Linux内核移植后退格键失效的问题

    如果正在使用 xterm,可以用"tset"命令设置控制字符对应的操作。其他窗口中,假设目前使用/sbin/sh,尝试 $ stty erase ^H,这里^H 的输入是 Ctrl-H,某些时候可能需要 Ctrl-V、Ctrl-H 输入,还可以尝试 $ stty ...

    最实用的键盘基础知识

    Backspace键,用于删除前一个字符;Delete键,用于删除光标后的一个字符。还有Ctrl、Shift和Alt这三个修饰键,它们与其它键配合,能触发许多快捷操作,如Ctrl+C用于复制,Ctrl+V用于粘贴,Ctrl+Z用于撤销。 此外,...

Global site tag (gtag.js) - Google Analytics