<!DOCTYPE html>

 <html lang="en">

 <head>

   <meta charset="UTF-8">

   <title>Document</title>

 </head>

 <body>

   <table id="keybord">

     <tr>

       <td><input /></td>

       <td><input /></td>

       <td><input /></td>

       <td><input /></td>

     </tr>

     <tr>

       <td><input /></td>

       <td><input /></td>

       <td><input /></td>

       <td><input /></td>

     </tr>

     <tr>

       <td><input /></td>

       <td><input /></td>

       <td><input /></td>

       <td><input /></td>

     </tr>

   </table>

   <script type='text/javascript' src='jquery.js'></script>

   <script type="text/javascript">

     $(function(){

       var baseIndex=100;

       $('#keybord').find('tr').each(function(r){

         $(this).find('td').each(function(c){

           $(this).find('input').attr('tabindex',r*100+c+baseIndex).addClass('tbInput');

         });

       });

       $('#keybord .tbInput').live('keydown',function(evt){

         var tabIndex=parseInt($(this).attr('tabindex'));

           switch(evt.which){

             case 38://up

               tabIndex-=100;

               break;

             case 40://down

               tabIndex+=100;

               break;

             case 37://left

               tabIndex--;

               break;

             case 39://right

               tabIndex++;

               break;

             default:

               return;

           }

           if(tabIndex>0){

             $('#keybord .tbInput[tabindex]='+tabIndex+'}').focus();

             return false;

           }

           return true;

       });

     })

   </script>

 </body>

 </html>

js键盘操作事件的更多相关文章

  1. vue.js 键盘enter事件的使用

    在监听键盘事件时,我们经常需要检查常见的键值.Vue 允许为 v-on 在监听键盘事件时添加按键修饰符: <!-- 只有在 `keyCode` 是 13 时调用 `vm.submit()` -- ...

  2. js常用操作事件

    触发描述 方法 用法 点击 onclick="method();"   变换 onchange="testChange();"   双击 ondblclick= ...

  3. js中对arry数组的各种操作小结 瀑布流AJAX无刷新加载数据列表--当页面滚动到Id时再继续加载数据 web前端url传递值 js加密解密 HTML中让表单input等文本框为只读不可编辑的方法 js监听用户的键盘敲击事件，兼容各大主流浏览器 HTML特殊字符

    js中对arry数组的各种操作小结   最近工作比较轻松,于是就花时间从头到尾的对js进行了详细的学习和复习,在看书的过程中,发现自己平时在做项目的过程中有很多地方想得不过全面,写的不够合理,所以说啊 ...

  4. javascript - 可编辑表格控件 支持全键盘操作(无JS框架)

    项目中经常会用到表格编辑控件,网上也有不少,但是确实没有完全符合我要求的, 自己写一个吧! 1.该控件支持 数据显示列,文本编辑列,选择列,下拉列,索引列,删除列 六种列类型 2.支持全键盘操作,自定 ...

  5. JS基础--函数与BOM、DOM操作、JS中的事件以及内置对象

       前   言 絮叨絮叨 这里是JS基础知识集中讲解的第三篇,也是最后一篇,三篇JS的基础,大多是知识的罗列,并没有涉及更难得东西,干货满满!看完这一篇后,相信许多正在像我一样正处于初级阶段的同学, ...

  6. Js键盘事件全面控制，回车按键事件，键盘对应按键码，按键事件兼容各个浏览器。

    在网上查询的按键码如下: 一.键盘按键和键盘对应代码表:   字母按键码A <--------> 65 B <--------> 66 C <--------> 6 ...

  7. 【three.js第七课】鼠标点击事件和键盘按键事件的使用

    当我们使用鼠标操作three.js渲染出的对象时,不仅仅只是仅限用鼠标对场景的放大.缩小.旋转而已,还有鼠标左键.右键的点击以及键盘各种按键等等的事件.我们需要捕获这些事件,并在这些事件的方法里进行相 ...

  8. js键盘事件全面控制详解

      js键盘事件全面控制 主要分四个部分第一部分:浏览器的按键事件第二部分:兼容浏览器第三部分:代码实现和优化第四部分:总结 第一部分:浏览器的按键事件 用js实现键盘记录,要关注浏览器的三种按键事件 ...

  9. JS实现 键盘操作

    JS实现 键盘操作: 详情可以去其逛网查看其API并下载,地址:http://craig.is/killing/mice <!DOCTYPE html PUBLIC "-//W3C// ...

随机推荐

  1. UESTC 1256 昊昊爱运动 Map

    昊昊爱运动 Time Limit: 3000/1000MS (Java/Others)     Memory Limit: 65535/65535KB (Java/Others) 昊昊喜欢运动 他N天 ...

  2. jquery之event与originalEvent的关系、event事件对象用法浅析

    在jquery中,最终传入事件处理程序的 event 其实已经被 jQuery 做过标准化处理, 其原有的事件对象则被保存于 event 对象的 originalEvent 属性之中, 每个 even ...

  3. 2016ACM/ICPC亚洲区大连站-重现赛

    题目链接:http://acm.hdu.edu.cn/search.php?field=problem&key=2016ACM%2FICPC%D1%C7%D6%DE%C7%F8%B4%F3%C ...

  4. [HDOJ5952]Counting Cliques（DFS，剪枝）

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5952 题意:求图中规模为s的团的个数. DFS+剪枝,姿势不好很容易TLE啊. #include &l ...

  5. 【转+自己研究】新姿势之Docker Remote API未授权访问漏洞分析和利用

    0x00 概述 最近提交了一些关于 docker remote api 未授权访问导致代码泄露.获取服务器root权限的漏洞,造成的影响都比较严重,比如 新姿势之获取果壳全站代码和多台机器root权限 ...

  6. genome MuSic安装

    系统:ubuntu 15.04全程在root权限下安装 首先安装软件samtools ,必须是samtools-0.1.19 版本tar jxf samtools-0.1.19.tar.bz2cd s ...

  7. [SAP ABAP开发技术总结]字符串表达式String Expressions

    声明:原创作品,转载时请注明文章来自SAP师太技术博客( 博/客/园www.cnblogs.com):www.cnblogs.com/jiangzhengjun,并以超链接形式标明文章原始出处,否则将 ...

  8. centos vpn

    yum install ppp -y cd /usr/local/src wget http://dl.fedoraproject.org/pub/epel/7/x86_64/p/pptpd-1.4. ...

  9. Android——学习：线性布局权重分配

    LinearLayout在Android中被广泛使用,LinearLayout有一个比较重要的属性——android:layout_weight.按照字面理解就是该控件的权重,这个值默认是 零(0). ...

  10. git学习笔记04-将本地仓库添加到GitHub远程仓库-git比svn先进的地方

    第1步:创建SSH Key.在用户主目录下,看看有没有.ssh目录,如果有,再看看这个目录下有没有id_rsa和id_rsa.pub这两个文件,如果已经有了,可直接跳到下一步. 如果没有,打开Shel ...