`
hanjiangit
  • 浏览: 185359 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

onkeypress,onkeydown,onkeyup区别 和 javascript event.keycode值大全

阅读更多

onkeypress是在用户按下并放开任何字母数字键时发生。系统按钮(例如,箭头键和功能键)无法得到识别。 
onkeyup 是在用户放开任何先前按下的键盘键时发生。 
onkeydown 是在用户按下任何键盘键(包括系统按钮,如箭头键和功能键)时发生。

onkeypress 
As of Microsoft® Internet Explorer 4.0, the onkeypress event fires and can be canceled for the following keys:

Letters: A - Z (uppercase and lowercase) 
Numerals: 0 - 9 
Symbols: ! @ # $ % ^ & * ( ) _ - + = < [ ] { } , . / ? \ | ' ` " ~ 
System: ESC, SPACEBAR, ENTER


onkeydown 
As of Microsoft&reg; Internet Explorer 4.0, the onkeydown event fires for the following keys:

Editing: DELETE, INSERT 
Function: F1 - F12 
Letters: A - Z (uppercase and lowercase) 
Navigation: HOME, END, LEFT ARROW, RIGHT ARROW, UP ARROW, DOWN ARROW 
Numerals: 0 - 9 
Symbols: ! @ # $ % ^ & * ( ) _ - + = < [ ] { } , . / ? \ | ' ` " ~ 
System: ESC, SPACEBAR, SHIFT, TAB

As of Internet Explorer 5, the event also fires for the following keys:

Editing: BACKSPACE 
Navigation: PAGE UP, PAGE DOWN 
System: SHIFT+TAB

As of Internet Explorer 5, this event can be canceled for the following keys and key combinations by specifying event.returnValue=false:

Editing: BACKSPACE, DELETE 
Letters: A - Z (uppercase and lowercase) 
Navigation: PAGE UP, PAGE DOWN, END, HOME, LEFT ARROW, RIGHT ARROW, UP ARROW, DOWN ARROW 
Numerals: 0 - 9 
Symbols: ! @ # $ % ^ & * ( ) _ - + = < [ ] { } , . / ? \ | ' ` " ~ 
System: SPACEBAR, ESC, TAB, SHIFT+TAB

You can cancel all keys that fire the onkeydown event in HTML Applications, including most accelerator keys, such as ALT+F4.

In Internet Explorer 4.0, you cannot cancel the onkeydown event, but you can use the onkeypress event to cancel keyboard events.

两个一起按,可以这样:

if( window.event.shiftKey && event.keyCode==xx)

function document_onpress() 
{

if(event.keyCode=='13') 

document.all.div_Line.style.pixelLeft=document.all.div_Line.style.pixelLeft+1; 
document.all.div_Q.style.pixelLeft=document.all.div_Q.style.pixelLeft+1; 
document.all.div_T.style.pixelLeft=document.all.div_T.style.pixelLeft+1;
文章源自:烈火网,原文:
http://www.liehuo.net/a/200909/188880.html

 

键盘键和键盘键控制值一览表(键盘按键对应代码表)

适合EXT keycode的查询 
A <--------> 65 
B <--------> 66 
C <--------> 67 
D <--------> 68 
E <--------> 69 
F <--------> 70 
G <--------> 71 
H <--------> 72 
I <--------> 73 
J <--------> 74 
K <--------> 75 
L <--------> 76 
M <--------> 77 
N <--------> 78 
O <--------> 79 
P <--------> 80 
Q <--------> 81 
R <--------> 82 
S <--------> 83 
T <--------> 84 
U <--------> 85 
V <--------> 86 
W <--------> 87 
X <--------> 88 
Y <--------> 89 
Z <--------> 90 
0 <--------> 48 
1 <--------> 49 

2 <--------> 50 
3 <--------> 51 
4 <--------> 52 
5 <--------> 53 
6 <--------> 54 
7 <--------> 55 
8 <--------> 56 
9 <--------> 57 
数字键盘 1 <--------> 96 
数字键盘 2 <--------> 97 
数字键盘 3 <--------> 98 
数字键盘 4 <--------> 99 
数字键盘 5 <--------> 100 
数字键盘 6 <--------> 101 
数字键盘 7 <--------> 102 
数字键盘 8 <--------> 103 
数字键盘 9 <--------> 104 
数字键盘 0 <--------> 105 
乘号 <--------> 106 
加号 <--------> 107 
Enter <--------> 108 
减号 <--------> 109 
小数点 <--------> 110 
除号 <--------> 111 
F1 <--------> 112 
F2 <--------> 113 
F3 <--------> 114 
F4 <--------> 115 
F5 <--------> 116 
F6 <--------> 117 
F7 <--------> 118 
F8 <--------> 119 
F9 <--------> 120 
F10 <--------> 121 
F11 <--------> 122 
F12 <--------> 123 
F13 <--------> 124 
F14 <--------> 125 
F15 <--------> 126 
Backspace <--------> 8 
Tab <--------> 9 
Clear <--------> 12 
Enter <--------> 13 
Shift <--------> 16 
Control <--------> 17 
Alt <--------> 18 
Caps Lock <--------> 20 
Esc <--------> 27 
空格键 <--------> 32 
Page Up <--------> 33 
Page Down <--------> 34 
End <--------> 35 
Home <--------> 36 
左箭头 <--------> 37 
向上箭头 <--------> 38 
右箭头 <--------> 39 
向下箭头 <--------> 40 
Insert <--------> 45 
Delete <--------> 46 
Help <--------> 47 
Num Lock <--------> 144 
; : <--------> 186 
= + <--------> 187 
- _ <--------> 189 
/ ? <--------> 191 
` ~ <--------> 192 
[ { <--------> 219 
| <--------> 220 
] } <--------> 221 
'' ' <--------> 222

 

 

 

onkeypress:能够产生该事件的字符为:
Letters: A - Z (uppercase and lowercase)
Numerals: 0 - 9
Symbols: ! @ # $ % ^ & * ( ) _ - + = < [ ] { } , . / ? \ | ' ` " ~
System: ESC, SPACEBAR, ENTER
如果是输入Ctrl+C、Delete之类的,就不会产生该事件。
特别注意:对于中文没有效果
获取所按的键ASCII码(即大小写字母有分),可使用event.keyCode,要转换也可以对event.keyCode进行操作。
事件产生时value还没有包含所输入的字符。
如果要取消输入,可以使用event.keyCode = 0,也可以使用event.returnValue = false。
想获取控制键的情况,则使用event.altKey、altLeft、ctrlKey、ctrlLeft、shiftKey、shiftLeft。
当按住键盘不放时,会持续产生该事件。

这样看来,它只能处理中规中矩的事情。如输入只能大写,输入只能数字(但粘贴功能还会破坏这些规则)。

onkeydown:任何按键都能产生该事件,
即使按一下Ctrl键,也是激发该事件
用输入法输入中文时,每输入一个编码都产生一个事件,多得让人受不了,并且获得到的keyCode却是229。
其获取的是键盘的扫描码(即大小写字母不分),可使用event.keyCode,但不能使用event.keyCode来修改。(但这又是个例外:if (event.keyCode === 13) event.keyCode = 9;)
事件产生时value还没有包含所输入的字符。
如果要取消输入,不能使用event.keyCode = 0这种方式,但可以使用event.returnValue = false。
当按住键盘不放时,会持续产生该事件。

onkeyup:任何按键都能产生该事件,
即使按一下Ctrl键,也是激发该事件
用输入法输入中文时,每输入一个编码都产生一个事件,虽然也没办法获取汉字,但keyCode还好是编码。
其获取的是键盘的扫描码(即大小写字母不分),可使用event.keyCode,但不能使用event.keyCode来修改。
事件产生时value已经包含所输入的字符了。
event.keyCode = 0 与 event.returnValue = false都不能取消该事件。
当按住键盘不放时,不会持续产生该事件。只有最后放开,才产生。

我的目的是限制用户输入的长度(特别是中文),看了这三个事件,都没有一个方便的家伙。

有一种观点:长度验证不必在输入时进行,只要在光标离开或提交时验证,其实这不是最理想的,试想一下,一个输入框,用户心血来潮地输入了一大堆东西,然后提交,这时系统才告诉他不能输入这么多,这是个糟糕的体验。

另外我也看到一种处理方法:在输入框的onkeypress、onkeyup、onblur、onchange事件中全部加上超长取消的处理。感觉太多了,只要onkeyup体现即时控制,onchange处理鼠标粘贴、拖入这两个动作就可以了

分享到:
评论

相关推荐

    input 高级限制级用法

    &lt;input style="ime-mode:disabled" onkeydown="if(event.keyCode==13)event.keyCode=9"onKeyPress="if ((event.keyCode|| event.keyCode&gt;57)) event.returnValue=false"&gt; ``` 8. **限制输入为英文和数字(有闪烁...

    TextBoxJS.

    &lt;input style="ime-mode:disabled" onkeydown="if(event.keyCode==13) event.keyCode=9" onKeyPress="if((event.keyCode||event.keyCode&gt;57)) event.returnValue=false"&gt; ``` 8. **只允许输入英文字符**: - 使用...

    input高级用法input高级用法

    &lt;input style="ime-mode:disabled" onkeydown="if(event.keyCode==13) event.keyCode=9" onKeyPress="if((event.keyCode||event.keyCode&gt;57)) event.returnValue=false"&gt; ``` 通过设置`ime-mode`样式属性为`...

    js 键盘事件 鼠标单击事件

    通过本文的学习,我们可以了解到JavaScript中`onkeypress`、`onkeyup`和`onkeydown`三个键盘事件的基本用法以及如何在实际项目中进行应用。同时,还介绍了如何利用`event`对象来获取更多信息,以及如何使用ASCII码表...

    JavaScript网页表单元素Input的高级用法

    &lt;input type="text" onkeydown="if (event.keyCode == 13) event.keyCode = 9"&gt; ``` 这里通过设置`event.keyCode`为9(Tab键的键盘码)来模拟Tab键行为,使焦点移动到下一个输入框。 #### 5. 限制输入特定字符 在...

    安全技术,web前端,最常用的正则表达式

    &lt;input type="text" onkeydown="if (event.keyCode || event.keyCode &gt; 57) event.returnValue = false" onkeypress="if ((event.keyCode || event.keyCode &gt; 57)) event.returnValue = false"&gt; ``` 这里使用了`...

    jsp中input的高级运用

    " onKeyPress="if ((event.keyCode || event.keyCode &gt; 57) && event.keyCode != 46 && event.keyCode != 45 || value.match(/^\d{3}$/) || /\.\d{3}$/.test(value)) {event.returnValue = false;}" id="text_kfxe" ...

    常用限制input的方法

    value = value.replace(/\.\d*\./g, '.')" onkeypress="if ((event.keyCode || event.keyCode &gt; 57) && event.keyCode != 46 && event.keyCode != 45 || value.match(/^\d{3}$/) || /\.\d{3}$/.test(value)) { ...

    javascript-event-keycode-finder:找出javascript的OnKeyDown,OnKeyUp和OnKeyPress事件调用的键码的简单工具

    本文将深入探讨`OnKeyDown`、`OnKeyUp`和`OnKeyPress`这三个JavaScript键盘事件,以及如何使用键码(key codes)来识别用户按下或释放的特定按键。 `OnKeyDown`事件是在用户按下键盘上的一个键时触发,不论该键是否...

    js各种限制input输入汇总

    &lt;input type="text" style="ime-mode:disabled" onkeydown="if(event.keyCode==13) event.keyCode=9" onkeypress="if((event.keyCode||event.keyCode&gt;57)) event.returnValue=false" /&gt; ``` 这里使用了`onkeypress`...

    网页设计关于表单输入框的技巧代码

    5. 只允许输入中文:通过`&lt;input onkeyup="value=value.replace(/[-~]/g,'')"&gt;`和`&lt;input onkeydown="if(event.keyCode==13)event.keyCode=9"&gt;`,可以限制输入框只接受中文字符,同时避免输入法的闪动。 6. 只允许...

    js监听键盘事件的方法_原生和jquery的区别详解.docx

    原生JavaScript提供了三种主要的键盘事件监听方法:`onkeydown`、`onkeypress` 和 `onkeyup`。 1. **`onkeydown`**: - 触发时机:当一个键被按下时触发。 - 使用示例: ```javascript document.onkeydown = ...

    键盘 keycode的值 javascript时触发事件时很有用的要素

    JavaScript中的`onkeydown`、`onkeyup`和`onkeypress`事件可以配合使用,以覆盖键盘事件处理的多种情况。`onkeydown`和`onkeyup`分别表示按键按下和释放时触发的事件,而`onkeypress`则在按键按下时触发,并且不适用...

    JavaScript验证大全

    &lt;input type="text" onkeypress="if (event.keyCode || event.keyCode &gt; 57) event.returnValue = false;" /&gt; &lt;!-- 方式三 --&gt; &lt;input onkeyup="if (event.keyCode != 37 && event.keyCode != 39) value=value....

    Javascript之event大全

    - `onkeydown`、`onkeyup`和`onkeypress`: 处理键盘事件,`keyCode`属性用于识别按下的是哪个键。 4. **事件冒泡和阻止默认行为** - 事件冒泡是指事件从最深的节点开始,逐级向其父节点传播。`cancelBubble`属性...

    [JS]详尽解析window.event对象

    在`onkeydown`, `onkeyup`, 和 `onkeypress`事件中,你可以通过这个属性来识别用户按下了哪个键。 除了上述属性,`window.event`对象还包含其他属性,如`shiftKey`(检查Shift键状态)、`srcElement`(触发事件的...

    javascritp实现input输入框相关限制用法

    &lt;input onkeyup="value=value.replace(/[-~]/g,'')" onkeydown="if (event.keyCode == 13) event.keyCode = 9;" /&gt; ``` 这里使用`onkeyup`事件过滤非中文字符,并且同样实现了按 Enter 键跳转的功能。 #### 6. ...

Global site tag (gtag.js) - Google Analytics