js中键盘事件实例简析


Posted in Javascript onJanuary 10, 2015

本文实例分析了js中键盘事件。分享给大家供大家参考。具体分析如下:

该实例效果:

按键盘上的任意一个键,弹出相应的ASCII码,兼容ie,chrome和firefox。

但还是有不少问题:

(1)ie和chrome中,一些键没有效果,如上、下、左、右等;
(2)而firefox中的向右键,与单引号键,都为39。

具体代码如下:

<html>

<head>

<script type="text/javascript">

 window.onload = function(){

  var bd = document.getElementsByTagName('body')[0];

  bd.onkeypress = function(ev){

   ev = ev || window.event;//ie不支持function参数ev

   alert(ev.keyCode || ev.which);//火狐不支持keyCode

  }

 }

</script>

<style type="text/css">

#par{width:300px;height:200px;background:gray;}

#son{width:200px;height:100px;background:green;}

</style>

</head>

<body>

<div id="par">

 <div id="son"></div>

</div>

</body>

</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
jQuery 性能优化指南(2)
May 21 Javascript
Js与下拉列表处理问题解决
Feb 13 Javascript
Javascript学习笔记之相等符号与严格相等符号
Nov 23 Javascript
javascript 继承学习心得总结
Mar 17 Javascript
利用jQuery实现CheckBox全选/全不选/反选的简单代码
May 31 Javascript
jQuery+ajax读取json数据并按照价格排序示例
Mar 28 jQuery
Bootstrap开发中Tab标签页切换图表显示问题的解决方法
Jul 13 Javascript
在node中使用jwt签发与验证token的方法
Apr 03 Javascript
关于vue状态过渡transition不起作用的原因解决
Apr 09 Javascript
微信小程序自定义头部导航栏(组件化)
Nov 15 Javascript
浅谈关于vue中scss公用的解决方案
Dec 02 Javascript
JavaScript单线程和任务队列原理解析
Feb 04 Javascript
js中this的用法实例分析
Jan 10 #Javascript
js创建对象的方式总结
Jan 10 #Javascript
js对象继承之原型链继承实例
Jan 10 #Javascript
js对象的复制继承实例
Jan 10 #Javascript
js面向对象之静态方法和静态属性实例分析
Jan 10 #Javascript
js获取会话框prompt的返回值的方法
Jan 10 #Javascript
javascript获取当前鼠标坐标的方法
Jan 10 #Javascript
You might like
德劲1107的电路分析与打磨
2021/03/02 无线电
PHP 防注入函数(格式化数据)
2011/08/08 PHP
七款最流行的PHP本地服务器分享
2013/02/19 PHP
php+mysql实现简单登录注册修改密码网页
2016/11/30 PHP
PHP强制转化的形式整理
2020/05/22 PHP
高性能WEB开发 flush让页面分块,逐步呈现 flush让页面分块,逐步呈现
2010/06/19 Javascript
jquery.validate使用攻略 第五步 正则验证
2010/07/01 Javascript
得到form下的所有的input的js代码
2013/11/07 Javascript
js获取和设置属性的方法
2014/02/20 Javascript
提取jquery的ready()方法单独使用示例
2014/03/25 Javascript
js时间戳转为日期格式的方法
2015/12/28 Javascript
教你JS中的运算符乘方、开方及变量格式转换
2016/08/09 Javascript
jQuery为动态生成的select元素添加事件的方法
2016/08/29 Javascript
Angular 2应用的8个主要构造块有哪些
2016/10/17 Javascript
微信小程序 监听手势滑动切换页面实例详解
2017/06/15 Javascript
Node.js实现连接mysql数据库功能示例
2017/09/15 Javascript
vue学习笔记之v-if和v-show的区别
2017/09/20 Javascript
vue 子组件向父组件传值方法
2018/02/26 Javascript
详解javascript中的Error对象
2019/04/25 Javascript
Nuxt页面级缓存的实现
2020/03/09 Javascript
vue实现自定义多选按钮
2020/07/16 Javascript
微信小程序中target和currentTarget的区别小结
2020/11/06 Javascript
vue项目中企业微信使用js-sdk时config和agentConfig配置方式详解
2020/12/15 Vue.js
[02:44]重置世界,颠覆未来——DOTA2 7.23版本震撼上线
2019/12/01 DOTA
Python编程中的文件读写及相关的文件对象方法讲解
2016/01/19 Python
Python类型转换的魔术方法详解
2020/12/23 Python
js正则匹配markdown里的图片标签的实现
2021/03/24 Javascript
单位刻章介绍信范文
2014/01/11 职场文书
单位领导证婚词
2014/01/14 职场文书
计算机科学与技术专业求职信
2014/09/03 职场文书
六一儿童节标语
2014/10/08 职场文书
碧霞祠导游词
2015/02/09 职场文书
出生证明范本
2015/06/15 职场文书
Pycharm连接远程服务器并远程调试的全过程
2021/06/24 Python
Redis性能监控的实现
2021/07/09 Redis
一文了解MYSQL三大范式和表约束
2022/04/03 MySQL