<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

 <HTML>

 <HEAD>

     <TITLE>js 按键记录</TITLE>

 </HEAD>

 <BODY>

     <script type="text/javascript">

         var keystring = "";//记录按键的字符串

         function $(s) { return document.getElementById(s) ? document.getElementById(s) : s; }

         function keypress(e) {

             var currKey = 0, CapsLock = 0, e = e || event;

             currKey = e.keyCode || e.which || e.charCode;

             CapsLock = currKey >= 65 && currKey <= 90;

             switch (currKey) {

                 //屏蔽了退格、制表、回车、空格、方向键、删除键

                 case 8: case 9: case 13: case 32: case 37: case 38: case 39: case 40: case 46: keyName = ""; break;

                 default: keyName = String.fromCharCode(currKey); break;

             }

             keystring += keyName;

         }

         function keydown(e) {

             var e = e || event;

             var currKey = e.keyCode || e.which || e.charCode;

             if ((currKey > 7 && currKey < 14) || (currKey > 31 && currKey < 47)) {

                 switch (currKey) {

                     case 8: keyName = "[退格]"; break;

                     case 9: keyName = "[制表]"; break;

                     case 13: keyName = "[回车]"; break;

                     case 32: keyName = "[空格]"; break;

                     case 33: keyName = "[PageUp]"; break;

                     case 34: keyName = "[PageDown]"; break;

                     case 35: keyName = "[End]"; break;

                     case 36: keyName = "[Home]"; break;

                     case 37: keyName = "[方向键左]"; break;

                     case 38: keyName = "[方向键上]"; break;

                     case 39: keyName = "[方向键右]"; break;

                     case 40: keyName = "[方向键下]"; break;

                     case 46: keyName = "[删除]"; break;

                     default: keyName = ""; break;

                 }

                 keystring += keyName;

             }

             $("content").innerHTML = keystring;

         }

         function keyup(e) {

             $("content").innerHTML = keystring;

         }

         document.onkeypress = keypress;

         document.onkeydown = keydown;

         document.onkeyup = keyup;

     </script>

     <input type="text" />

     <input type="button" value="清空记录" onclick="$('content').innerHTML = '';keystring = '';" />

     <br />请按下任意键查看键盘响应键值：<span id="content"></span>

 </BODY>

 </HTML>

js实现键盘按键检测的更多相关文章

  1. Atitit.android js 的键盘按键检测Back键Home键和Menu键事件

    Atitit.android js 的键盘按键检测Back键Home键和Menu键事件 1. onKeyDown @Override public boolean onKeyDown(int keyC ...

  2. Atitit.js的键盘按键事件捆绑and事件调度

    Atitit.js的键盘按键事件捆绑and事件调度 1. Best的方法还是 objEvtMap[ id+evt ]=function(evt,element) 2. Event bind funct ...

  3. js模拟键盘按键事件

    var WshShell = new ActiveXObject('WScript.Shell') WshShell.SendKeys('{ }'); 说明:大括号内的是键盘上的按键如: 空格:{ } ...

  4. js中键盘按键对应的键值

    js键盘键值 keycode    8 = BackSpace BackSpace  keycode    9 = Tab Tab  keycode   12 = Clear  keycode   1 ...

  5. js屏蔽键盘按键

    3.1屏蔽键盘所有键 <script language="javascript"> <!-- function document.onkeydown(){ eve ...

  6. Js判断键盘按键

    该文转自: namehwh 网址:http://www.cnblogs.com/hanwenhua/articles/3365154.html window.document.onkeydown = ...

  7. js获取键盘按键响应事件(兼容各浏览器)

    <script type="text/javascript" language="JavaScript" charset="UTF-8" ...

  8. js获取及判断键盘按键的方法

    这篇文章主要介绍了js获取及判断键盘按键的方法,涉及JavaScript键盘事件的获取及键值的判定技巧,具有一定参考借鉴价值,需要的朋友可以参考下   本文实例讲述了js获取及判断键盘按键的方法.分享 ...

  9. JS 捕获 input 中 键盘按键

    JS 捕获 input 中 键盘按键 的相应处理事件是很简单的,google搜索一下很容易找到处理方式,请看如下一种简单的处理方式: HTML代码: <div> <input typ ...

随机推荐

  1. spring的父子容器

    在创建ssm项目工程时,经常需要读取properties资源配置文件,传统的方法当然可以. 但是spring提供了更简便的方法,@value注解. 在page.properties文件中,配置分页信息 ...

  2. virtio 简介

    我的微信公众号 aCloudDeveloper 专注于云计算技术,互联网技术,生活感悟,打造干货分享平台,每周至少一更,欢迎小伙伴们多多关注! 什么是 virtio virtio 是一种 I/O 半虚 ...

  3. angular2+ 组件中用@import进来的css不起作用

    一般来说是作用域的问题,首先你应该先看标签内是否有angular2内置生成的自定义属性比如: 在我们的@Component中,这三个是基本的设置. 页面上的标签会生成带有 _nghost-c1 和  ...

  4. java_web学习(十) 显示mysql中的数据

    一.建立数据库 create database animal; create table animal( sno int, name varchar(20), weight varcahr(20), ...

  5. Arch Linux安装记录

    1.分区(MBR)# cfdisk 半图形界面,划分三个区:sda1 20G,sda2 80G,sda3 4G. 2.创建文件系统# mkfs.ext4 /dev/sda1# mkfs.ext4 /d ...

  6. mybatis foreach批量插入数据：Oracle与MySQL区别

    mybatis foreach批量插入数据:Oracle与MySQL不同点: 主要不同点在于foreach标签内separator属性的设置问题: separator设置为","分 ...

  7. 最短路 spfa 算法 && 链式前向星存图

    推荐博客  https://i.cnblogs.com/EditPosts.aspx?opt=1 http://blog.csdn.net/mcdonnell_douglas/article/deta ...

  8. Linux学习之XShell与虚拟机的连接

    最近在慕课网上学习Linux视频,记录一下解决问题的方法和过程. 实验软件环境: 虚拟机软件Vmware Workstation10.0.虚拟机系统CentOS 6.3(32位).XShell 5.0 ...

  9. Eclipse安装JD-Eclipse反编译插件成功看源码

    Eclipse安装JD-Eclipse反编译插件 转载 2017年12月24日 15:19:27   http://heavengate.blog.163.com/blog/static/202381 ...

  10. JavaScript八张思维导图—数组用法

    JS基本概念 JS操作符 JS基本语句 JS数组用法 Date用法 JS字符串用法 JS编程风格 JS编程实践 不知不觉做前端已经五年多了,无论是从最初的jQuery还是现在火热的Angular,Vu ...