为什么给文本域绑定onkeypress的问题？

给文本域绑定onkeypress，触发时机是在按下键时就触发，而不是按下再松开后触发；另外，为什么清空文本域的内容，字数提示不是立即变化呢，而另外两个却能立即变化？

源自：JavaScript DOM事件 4-3 编程练习

收起

3回答

小丸子爱吃菜回答被采纳获得+3积分 2017-04-05 14:31:21

onkeypress事件是在按键按下的时候发生（只对数字以及字母有效）；
onkeydown事件是在按键按下的时候发生；
onkeyup事件是在按键松开（释放）的时候发生。

有键按下 -> 产生onKeyDown事件 -> 如果是有ASCII码的按键, 则产生onKeyPress事件
有键释放 -> 产生onKeyUp事件

像Shift、Ctrl、Alt、F1、F2、...等按键是不会产生onKeyPress事件的。

小丸子爱吃菜 2017-04-04 20:22:19

在中文状态下输入onkeypress是没有效果的，要切换成英文状态，所以可以使用onkeydown或者onkeyup来进行实现。

提问者 XhmTLnz丶 #1

那为什么onkeypress的触发时机会和onkeydown一样呢，不是应该按下然后松开后触发吗？

2017-04-05 00:51:48
红星双子 #2

ASCII是什么？

2017-10-17 21:23:51
小丸子爱吃菜回复红星双子 #3

如果有问题，可以重新创建一个问题去追问，如果盖得楼比较多，很容易被忽略。 ASCII是基于拉丁字母的一套电脑编码系统，具体的可以去网上查阅一下。

2017-10-18 09:34:23

小丸子爱吃菜 2017-04-04 11:51:46

这是你代码中存在的问题还是？如果是你代码中存在的问题，可以将代码发过来，帮你看下具体是什么问题！

祝学习愉快！

提问者 XhmTLnz丶 #1

<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>输入文本</title> </head> <body> <p>字数限制在30字内，<span id="span1">您还可以输入<b id="allow">30</b> 字</span><span id="span2" style="display:none"></span></p> <textarea cols="50" rows="7" id="text"></textarea> <script type="text/javascript"> var allow = document.getElementById("allow"); var textarea = document.getElementById("text"); var span1 = document.getElementById("span1"); var span2 = document.getElementById("span2"); var total = 30; textarea.onkeypress = function(){ var len = this.value.length; var left = total-len; if(left<0){ span1.style.display = "none"; span2.style.display = "inline"; span2.innerHTML = "您已超出"+(len-total)+"字"; }else{ span2.style.display="none"; span1.style.display="inline"; allow.innerHTML = left; } } </script> </body> </html>

2017-04-04 14:44:07
提问者 XhmTLnz丶 #2

老师您可以复制下来试一下，如果换成onkeyup事件就没问题，但若是onkeypress就会出问题

2017-04-04 14:45:20
提问者 XhmTLnz丶 #3

而且我的safari不兼容这个onkeypress事件，但在chrome上试过后发现触发时机和onkeydown一样，不是按下并松开后触发，而是按下就触发，另外输入字体有反应，但是按下delete键没反应

2017-04-04 14:50:49