Chrome中的onkeypress 的keyCode BUG
来源:互联网 发布:js脚本入门 编辑:程序博客网 时间:2024/05/22 10:33
在Chrome中onkeypress的keyCode和onkeydown中的keyCode并不一致...
其中onkeypress无法捕获F1~F12,onkeydown可以捕获
onkeypress捕获a-z时区分大小写,onkeydown不区分大小写。
最主要的一个问题就在于a-z的大小写,由于onkeypress不捕获F1~F12,但是区分a-z的大小写。而且直接用的字母的ascii码,就导致小写字母的一部分keyCode覆盖了F1~F12,因而判断这里的keyCode的时候,会发生混乱。
如下测试(输入的abctuvABCTUV):
可以看到在输入小写字母的时候,keypress和keydown完全不一样,在输入大写字母的时候,两者是一致的。
因而,在使用时必须注意。在Chrome和IE中使用keydown完全能达到要求,似乎在firefox中需要用keypress,如果想要两者都兼容怎么办?
千万不要同时写keypress和keydown,这样在你输入小写字母“t"的时候,说不定就引发了F5刷新的效果。
至于应该怎么做,还是建议判断浏览器,然后设置对应的事件。
最后附上测试代码:
- <!doctype html>
- <html lang="zh">
- <head>
- <meta charset="UTF-8">
- <title>KeyPress Test</title>
- <script>
- document.onkeypress =keypress;
- function keypress() {
- document.getElementById('keypress').value += '\n' + ('keyCode:'+event.keyCode);
- }
- document.onkeydown =keydown;
- function keydown() {
- document.getElementById('keydown').value += '\n' + ('keyCode:'+event.keyCode);
- }
- function Clear(){
- document.getElementById('keypress').value ='';
- document.getElementById('keydown').value ='';
- }
- </script>
- </head>
- <body>
- <input type="button"value="Clear"onclick="Clear()"style="width:305px"/><br/>
- KeyPress - keyCode Result:<br/>
- <textarea id="keypress"style="width:300px;height:200px" readonly></textarea><br/>
- KeyDown - keyCode Result:<br/>
- <textarea id="keydown"style="width:300px;height:200px" readonly></textarea>
- </body>
- </html>
0 0
- Chrome中的onkeypress 的keyCode BUG
- Chrome中的onkeypress 的keyCode BUG
- 检查输入的是否是数字 keyCode onkeypress
- Javascript中的onkeydown、onkeypress、onkeyup的区别
- 文本框中onkeypress在火狐无法输入的bug
- 发现Chrome的一个bug
- onkeypress的作用
- 使用rem时chrome中的bug
- onkeypress
- KeyEventArgs中的KeyCode,KeyValue,KeyData的区别
- KeyEventArgs中的KeyCode,KeyValue,KeyData的区别
- KeyEventArgs中的KeyCode,KeyValue,KeyData的区别
- onkeypress 与 onkeydown的区别
- onkeypress onkeyup onkeydown 的区别
- onkeypress,onkeyup,onkeydown的区别
- onkeypress 和 onkeydown 的区别
- JavaScript的onkeypress键盘事件
- onkeyup,onkeydown,onkeypress的区别
- PAT QQ帐户的申请与登陆(25)(map的应用)
- hailstone.cpp
- Python基础教程(第五章)
- Mybatis分页插件 - 示例
- java 序列化和反序列化总结
- Chrome中的onkeypress 的keyCode BUG
- ACboy needs your help(分组背包)
- PE文件结构(三) 输入表
- 数据结构 第一章绪论
- 百度bae的wp伪静态好难啊
- Mybatis 贴吧问答 第一期
- 谓词推入演示
- partysip配置与启动
- Mybatis 示例之 复杂(complex)属性(property)