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和 ...
随机推荐
- OrderBy和OrderByDescending排序
昨天有练习对数字阵列进行排序,<C#阵列Array排序>https://www.cnblogs.com/insus/p/10825174.html 其实一切都弄得很复杂,array已经有2 ...
- 当Python中混进一只薛定谔的猫……
本文原创并首发于公众号[Python猫],未经授权,请勿转载. 原文地址:https://mp.weixin.qq.com/s/-fFVTgWVsydFsNu1nyxUzA Python 是一门强大的 ...
- Linux shell 单引号和双引号
在编写shell脚本的时候经常会用到引号,有些时候却老是忘记单引号和双引号之间的区别, 所以就整理一下供以后脑子不好使了的时候前来复习一下.首先说下他们的共同点: 好像就只有 一个,就是它们都可以用来 ...
- Windwos10环境下的Geany的安装与新手使用
相信学习Python的小伙伴都会接触到Geany这个轻量级的python文本编辑器吧,下面就是我对于安装Geany的一些小经验分享. 1:安装geany很简单,进入geany官网download下载相 ...
- 笔记-JavaWeb学习之旅18
AJAX:ASynchronous JavaScript And XML 异步的JavaScript 和XML 异步和同步:客户端和服务器端相互通信的基础上 同步:客户端操作后必须等待服务器端的响应, ...
- 初次学习DropWizard框架——解决maven打包时出现没有主清单属性的问题
笔者因为公司的项目需要,开始接触DropWizard框架,照着官网https://www.dropwizard.io/0.9.2/docs/getting-started.html撸了一遍. 工具为I ...
- npm ERR! missing script: build
webpack-bundle-analyzer webpack可视化插件,用来查看一共打了多少个包,每个包的体积和包里面的情况. 启动查看 npm run build --report 结果报错npm ...
- Codeforces 185B（数学结论）
要点 有不等式\(x^ay^bz^c=a^ab^bc^c(\frac{x}{a})^a(\frac{y}{b})^b(\frac{z}{c})^c<=a^ab^bc^c(\frac{x+y+z} ...
- Avito Cool Challenge 2018-B. Farewell Party(思维）
time limit per test 1 second memory limit per test 256 megabytes input standard input output standar ...
- Ubuntu新服务器安装lnmp
版本: nginx(无要求,最新) mysql(5.6.xx) php(5.6.xx) ubuntu(16.04,其他版本也并无过多差异) 准备: #apt-get update #apt-get i ...