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打包类,基本可以实现所有的滚动效果,太强了
Dec 08 Javascript
jquery中event对象属性与方法小结
Dec 18 Javascript
在javascript中执行任意html代码的方法示例解读
Dec 25 Javascript
ajax在兼容模式下失效的快速解决方法
Mar 22 Javascript
js实现按钮控制带有停顿效果的图片滚动
Aug 30 Javascript
Vuex和前端缓存的整合策略详解
May 09 Javascript
js实现放大镜特效
May 18 Javascript
纯js封装的ajax功能函数与用法示例
May 14 Javascript
vue中过滤器filter的讲解
Jan 21 Javascript
如何利用vue+vue-router+elementUI实现简易通讯录
May 13 Javascript
Vue-CLI 3 scp2自动部署项目至服务器的方法
Jul 24 Javascript
基于JS实现快速读取TXT文件
Aug 25 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
PHP通过header实现文本文件下载的代码
2010/08/08 PHP
yii2.0之GridView自定义按钮和链接用法
2014/12/15 PHP
php计算到指定日期还有多少天的方法
2015/04/14 PHP
PHP入门教程之表单与验证实例详解
2016/09/11 PHP
PHP通过文件路径获取文件名的实例代码
2018/10/14 PHP
学习YUI.Ext 第四天--对话框Dialog的使用
2007/03/10 Javascript
在网页中使用document.write时遭遇的奇怪问题
2010/08/24 Javascript
JQuery给元素添加/删除节点比如select
2013/04/02 Javascript
js获取当前路径的简单示例代码
2014/01/08 Javascript
Jquery遍历checkbox获取选中项value值的方法
2014/02/13 Javascript
node.js中的fs.writeFileSync方法使用说明
2014/12/14 Javascript
js实现键盘Enter键提交表单的方法
2015/05/27 Javascript
JS控制按钮10秒钟后可用的方法
2015/12/22 Javascript
如何在AngularJs中调用第三方插件库
2017/05/21 Javascript
weui框架实现上传、预览和删除图片功能代码
2017/08/24 Javascript
vue中如何创建多个ueditor实例教程
2017/11/14 Javascript
微信小程序访问豆瓣电影api的实现方法
2019/03/31 Javascript
JS实现星星海特效
2019/12/24 Javascript
openlayers 3实现车辆轨迹回放
2020/09/24 Javascript
Array.filter中如何正确使用Async
2020/11/04 Javascript
python求解水仙花数的方法
2015/05/11 Python
Python利用BeautifulSoup解析Html的方法示例
2017/07/30 Python
Django 生成登陆验证码代码分享
2017/12/12 Python
详解Tensorflow数据读取有三种方式(next_batch)
2018/02/01 Python
python提取log文件内容并画出图表
2019/07/08 Python
Kears+Opencv实现简单人脸识别
2019/08/28 Python
python实现图片插入文字
2019/11/26 Python
使用python实现微信小程序自动签到功能
2020/04/27 Python
HTML5的一个显示电池状态的API简介
2015/06/18 HTML / CSS
英国领先的NHS批准的在线药店:Pharmacy2U
2017/01/06 全球购物
护士思想汇报
2014/01/12 职场文书
水知道答案观后感
2015/06/08 职场文书
业务员管理制度范本
2015/08/06 职场文书
2019年幼儿园管理条例范本!
2019/07/17 职场文书
《Estab Life》4月6日播出 正式PV、主视觉图公开
2022/03/20 日漫
Django数据库(SQlite)基本入门使用教程
2022/07/07 Python