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 相关文章推荐
js 巧妙去除数组中的重复项
Jan 25 Javascript
解析DHTML,JavaScript,DOM,BOM以及WEB标准的描述
Jun 19 Javascript
jquery显示隐藏input对象
Jul 21 Javascript
在JavaScript中使用对数Math.log()方法的教程
Jun 15 Javascript
JavaScript实现文字跟随鼠标特效
Aug 06 Javascript
javascript下使用Promise封装FileReader
Feb 19 Javascript
Node.js开发者必须了解的4个JS要点
Feb 21 Javascript
Vue.js第三天学习笔记(计算属性computed)
Dec 01 Javascript
性能优化篇之Webpack构建速度优化的建议
Apr 03 Javascript
JS实现烟花爆炸效果
Mar 10 Javascript
详解Vue3中对VDOM的改进
Apr 23 Javascript
vue实现在线学生录入系统
May 30 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
PHP5/ZendEngine2的改进
2006/10/09 PHP
PHP中将字符串转化为整数(int) intval() printf() 性能测试
2020/03/20 PHP
php中大括号作用介绍
2012/03/22 PHP
PHP对象Object的概念 介绍
2012/06/14 PHP
PHP下打开phpMyAdmin出现403错误的问题解决方法
2013/05/23 PHP
windows7配置Nginx+php+mysql的详细教程
2016/09/04 PHP
jQuery 操作下拉列表框实现代码
2010/02/22 Javascript
离开页面时检测表单元素是否被修改,提示保存的js代码
2010/08/25 Javascript
工作中常用到的JS表单验证代码(包括例子)
2010/11/11 Javascript
JS保留两位小数,多位小数的示例代码
2014/01/07 Javascript
javascript中为某个元素指定事件的三种方式
2014/08/07 Javascript
js实现不提交表单获取单选按钮值的方法
2015/08/21 Javascript
JavaScript数组合并的多种方法
2016/05/22 Javascript
angularjs ocLazyLoad分步加载js文件实例
2017/01/17 Javascript
node.js中EJS 模板快速入门教程
2017/05/08 Javascript
Vue.js实现在下拉列表区域外点击即可关闭下拉列表的功能(自定义下拉列表)
2017/05/30 Javascript
js使用Promise实现简单的Ajax缓存
2018/11/14 Javascript
VUE使用 wx-open-launch-app 组件开发微信打开APP功能
2020/08/11 Javascript
vue+高德地图实现地图搜索及点击定位操作
2020/09/09 Javascript
[34:44]Liquid vs TNC Supermajor 胜者组 BO3 第二场 6.4
2018/06/05 DOTA
介绍Python中的文档测试模块
2015/04/28 Python
使用PyTorch实现MNIST手写体识别代码
2020/01/18 Python
pycharm设置python文件模板信息过程图解
2020/03/10 Python
python 使用raw socket进行TCP SYN扫描实例
2020/05/05 Python
CSS3下的渐变文字效果实现示例
2018/03/02 HTML / CSS
美国打印机墨水和碳粉购物网站:QuikShip Toner
2018/08/29 全球购物
酒店服务实习自我鉴定
2013/09/22 职场文书
平面设计师的工作职责
2013/11/21 职场文书
现金会计岗位职责
2013/12/05 职场文书
给护士表扬信
2014/01/19 职场文书
《燕子专列》教学反思
2014/02/21 职场文书
演讲稿格式范文
2014/05/19 职场文书
2014年党员教师自我剖析材料
2014/09/30 职场文书
2016大学军训心得体会
2016/01/11 职场文书
《进击的巨人》新联动CM 兵长强势出击兽巨人
2022/04/05 日漫
Navicat Premium自定义 sql 标签的创建方式
2022/09/23 数据库