JavaScript onkeydown事件入门实例(键盘某个按键被按下)
JavaScript onkeydown 事件
用户按下一个键盘按键时会触发 onkeydown 事件。与 onkeypress事件不同的是,onkeydown 事件是响应任意键按下的处理(包括功能键),onkeypress 事件只响应字符键按下后的处理。
提示
Internet Explorer/Chrome 浏览器使用 event.keyCode 取回被按下的字符,而 Netscape/Firefox/Opera 等浏览器使用 event.which。
onkeydown 获取用户按下的键
下面是一个利用 onkeydown 事件获取用户按下键盘按键信息的例子:
<body>
<script type="text/javascript">
function noNumbers(e)
{
var keynum;
var keychar;
keynum = window.event ? e.keyCode : e.which;
keychar = String.fromCharCode(keynum);
alert(keynum+':'+keychar);
}
</script>
<input type="text" onkeydown="return noNumbers(event)" />
</body>
</html>
如上面例子所示,event.keyCode/event.which 得到的是一个按键对应的数字值(Unicode 编码),常用键值对应如下:
数字值 | 实际键值 |
---|---|
48到57 | 0到9 |
65到90 | a到z(A到Z) |
112到135 | F1到F24 |
8 | BackSpace(退格) |
9 | Tab |
13 | Enter(回车) |
20 | Caps_Lock(大写锁定) |
32 | Space(空格键) |
37 | Left(左箭头) |
38 | Up(上箭头) |
39 | Right(右箭头) |
40 | Down(下箭头) |
在 Web 应用中,常常可以看到利用 onkeydown 事件的 event.keyCode/event.which 来获取用户的一些键盘操作,从而运行某些运用的例子。如在用户登录时,如果按下了大写锁定键(20),则加以提示大写锁定;在有翻页的时候,如果用户按下左右箭头,触发上下翻页等。
获得 Unicode 编码值之后,如果需要得到实际对应的按键值,可以通过 Srting 对象的 fromCharCode 方法(String.fromCharCode())获得。注意,对于字符获得的始终是大写字符,而对于其他一些功能按键,得到的字符可能不太易阅读。
PS:这里再为大家推荐一款关于JS事件的在线查询工具,归纳总结了JS常用的事件类型与函数功能:
javascript事件与功能说明大全:
http://tools.jb51.net/table/javascript_event
JavaScript onkeydown事件入门实例(键盘某个按键被按下)的更多相关文章
- JavaScript的事件对象_键盘事件
用户在使用键盘时会触发键盘事件.“DOM2 级事件”最初规定了键盘事件,结果又删除了相应的内容.最终还是使用最初的键盘事件,不过 IE9 已经率先支持“DOM3”级键盘事件. 一.键码 在发生 key ...
- JavaScript的事件对象中的特殊属性和方法(鼠标,键盘)
鼠标操作导致的事件对象中的特殊属性和方法 鼠标事件是 Web 上面最常用的一类事件,毕竟鼠标还是最主要的定位设备.那么通过事件对象可以获取到鼠标按钮信息和屏幕坐标获取等 鼠标按钮 只有在主鼠标按钮被单 ...
- 前端之JavaScript 04 事件 (未全)
一.事件类型 常见的主要事件类型介绍如下: onfocus 元素获得焦点. 练习:输入框 onblur 元素失去焦点. 应用场景:用于表单验证,用户离开某个输入框时,代表已经输入完了,我们可以对它进行 ...
- javascript——常用事件总结
Event对象:Event 对象代表事件的状态,比如事件在其中发生的元素.键盘按键的状态.鼠标的位置.鼠标按钮的状态. 事件标签属性 当以下情况发生时,出现此事件 onabort 图像加载被中断 ...
- JavaScript DOM事件对象的两个小练习 | 学习内容分享
Event 对象 Event 对象代表事件的状态,比如事件在其中发生的元素.键盘按键的状态.鼠标的位置.鼠标按钮的状态. 事件通常与函数结合使用,函数不会在事件发生前被执行! 本文用于记录个人学习过程 ...
- 第一百一十九节,JavaScript事件入门
JavaScript事件入门 学习要点: 1.事件介绍 2.内联模型 3.脚本模型 4.事件处理函数 JavaScript事件是由访问Web页面的用户引起的一系列操作,例如:用户点击.当用户执行某些操 ...
- JavaScript事件---事件入门
内容提纲: 1.事件介绍 2.内联模型 3.脚本模型 4.事件处理函数 JavaScript事件是由访问Web页面的用户引起的一系列操作,例如:用户点击.当用户执行某些操作的时候,再去执行一系列代码. ...
- onkeyup 事件会在键盘按键被松开时发生
定义和用法 onkeyup 事件会在键盘按键被松开时发生. 语法 onkeyup="SomeJavaScriptCode" 参数 描述 SomeJavaScriptCode 必需. ...
- JavaScript(第二十三天)【事件入门】
JavaScript事件是由访问Web页面的用户引起的一系列操作,例如:用户点击.当用户执行某些操作的时候,再去执行一系列代码. 一.事件介绍 事件一般是用于浏览器和用户操作进行交互.最早是IE和 ...
随机推荐
- luogu P5358 [SDOI2019]快速查询【模拟(?)】
把有单点修改和查询的点离散进一个数组,然后单点修改直接改,记录一个修改时间t,维护一个sm表示这些离散的点的和,val表示出了离散点其他点的值,因为都是一样的所以只记录这一个值即可,记录ljlc为加法 ...
- 【实验吧】该题不简单——writeup
题目地址:http://ctf5.shiyanbar.com/crack/3/ 一定要注意读题: 要求找出用户名为hello的注册码,这八成就是 要写注册机啊! ——————————————————— ...
- mysql导入文件
手里有一个web源码工程文件夹 mysql导入文件: 新建连接,名称随意,用修改设置的用户密码登录,我的连接名称是eee 右击information_schema,建立数据库,数据库名称源码文件名,字 ...
- [題解](函數下整點個數?)luogu_P4132_BZOJ_2659_算不出的等式
兩個都是一次函數,下取整就是整點個數,兩個函數k剛好成倒數,所以最後發現會組合成一個矩形 (為啥要考慮重複與否的問題???) 然而這樣會不會重複計算點數呢 我們發現因為取的是圖像下的整數點 所以要想重 ...
- Django-Rest-Framework的序列化之serializers 序列化组件
Django-Rest-Framework的序列化之serializers 序列化组件 restful framework 正常的序列化 from django.http import HttpRes ...
- xxe漏洞分析
xxe漏洞总结 xxe漏洞就是xml外部实体注入攻击,所以一定是针对xml编写的服务. xxe漏洞是把参数经过php输入流或者$HTTP_RAW_POST_DATA直接读入xml实体当中,参数可控且没 ...
- [Android基础]Android四大组件之BroadCast
BroadCast的定义: 广播是一种订阅--通知 事件,广播接收者向Android系统 register (订阅广播),广播发送者向Adnroid系统 sendBroadCast(发送广播),然后A ...
- HDU-2586-How far away(LCA Tarjan离线算法)
链接:https://vjudge.net/problem/HDU-2586 题意: 勇气小镇是一个有着n个房屋的小镇,为什么把它叫做勇气小镇呢,这个故事就要从勇气小镇成立的那天说起了,修建小镇的时候 ...
- jetty jndi数据源
applicationContext.xml <?xml version="1.0" encoding="utf-8"?> <beans de ...
- python 4学习 list 和 tuple
list Python内置的一种数据类型是列表:list.list是一种有序的集合,可以随时添加和删除其中的元素. 比如,列出班里所有同学的名字,就可以用一个list表示: >>> ...