<!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. Linux Shell脚本面试25问

    Q:1 Shell脚本是什么.它是必需的吗? 答:一个Shell脚本是一个文本文件,包含一个或多个命令.作为系统管理员,我们经常需要使用多个命令来完成一项任务,我们可以添加这些所有命令在一个文本文件( ...

  2. Git恢复reset --hard丢失的文件

    在使用 Git 的过程中,有时会不小心丢失 commit 信息.这一般出现在以下情况下:强制删除了一个分支而后又想重新使用这个分支,hard-reset 了一个分支从而丢弃了分支的部分 commit. ...

  3. java虚拟机能并发的启动多少个线程

    新建一个类,导入如下的测试代码: public class TestNativeOutOfMemoryError { public static void main(String[] args) { ...

  4. Why And When To Use Pre-Update and Pre-Insert Triggers In Oracle Forms

    Whenever we commit after entering data in Oracle Forms, many triggers fires during this event and al ...

  5. Highlighting Text Item On Entry In Oracle Forms

    Highlight a Text Item in Oracle Forms With Visual Attribute It is very necessary to highlight the cu ...

  6. @JoinColumn

    @OneToOne注释只能确定实体与实体的关系是一对一的关系,不能指定数据库表中的保存的关联字段.所以此时要结合@JoinColumn标记来指定保存实体关系的配置. @JoinColumn与本书上一章 ...

  7. Spring与其他Web框架集成

    Spring与多种流行Web应用框架(Struts.JSF和DWR)集成的方法. Spring强大的IoC容器和企业支持特性使其十分适于实现Java EE应用的服务和持续层. 对于表现层,可以在许多不 ...

  8. Get started with Gazebo in ROS

    Run Gazebo These three steps will run Gazebo with a default world. Install Gazebo. Open a terminal. ...

  9. Codeforces Round #378 (Div. 2) D. Kostya the Sculptor map+pair

    D. Kostya the Sculptor time limit per test 3 seconds memory limit per test 256 megabytes input stand ...

  10. Codeforces Round #375 (Div. 2) D. Lakes in Berland dfs

    D. Lakes in Berland time limit per test 2 seconds memory limit per test 256 megabytes input standard ...