JavaScript中的onkeypress,onkeydown,onkeyup

onkeypress,onkeydown,onkeyup是js中的三种键盘事件.
onkeypress响应的是键盘按下的字符(keyCode是assic码,区分大小写,响应可以表达的字符)
onkeydown响应的是键盘按下的字符与功能键(不区分大小写,字符均视为大写,响应你按下的是什么键)
(知道为什么键盘上都是大写字母吗)
onkeyup响应的是键盘松开的字符与功能键(同上)
可以亲自试一下(谷歌浏览器)

<body>
onkeypress<input type="text" id="1">
onkeydown<input type="text" id="2">
onkeyup<input type="text" id="3">
<script>
   document.onkeypress=function(){
       document.getElementById("1").value=event.keyCode;
   }
   document.onkeydown=function(){
       document.getElementById("2").value=event.keyCode;
   }
   document.onkeyup=function(){
       document.getElementById("3").value=event.keyCode;
   }
</script>
</body>

用表单输出keyCode就可以知道每个事件响应的keyCode.

按下 			press	down	up
CapsLock		无响应	20		20
A(大小锁定)		65		65		65
a(小写)			97		65		65
空格				32		32		32
CTRL			无响应	17		17
F1				无响应	122		122
1				49 		49		49
1(小键盘)		49		97		97
回车				13		13		13
(小键盘)		无响应	38		38
Esc				无响应	27		27

一直按下键盘时onkeypress,onkeydown都会不断响应.
以叠加的方式表示(替换上文的代码)

document.onkeypress=function(){
    document.getElementById("1").value+=event.keyCode;
}
document.onkeydown=function(){
    document.getElementById("2").value+=event.keyCode;
}

并且onkeydown比onkeypress先响应
以叠加的方式表示(替换上文的代码)

document.onkeypress=function(){
    document.getElementById("1").value+=event.keyCode;
}
document.onkeydown=function(){
    document.getElementById("1").value+=event.keyCode;
}

onkeypress和onkeydown都是发生在字符输入之前,即此时还不能获得输入的字符,
如果要实时获得数据得用keyup.

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值