js键盘操作事件

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4   <meta charset="UTF-8">
 5   <title>Document</title>
 6 </head>
 7 <body>
 8   <table id="keybord">
 9     <tr>
10       <td><input /></td>
11       <td><input /></td>
12       <td><input /></td>
13       <td><input /></td>
14     </tr>
15     <tr>
16       <td><input /></td>
17       <td><input /></td>
18       <td><input /></td>
19       <td><input /></td>
20     </tr>
21     <tr>
22       <td><input /></td>
23       <td><input /></td>
24       <td><input /></td>
25       <td><input /></td>
26     </tr>
27   </table>
28   <script type=‘text/javascript‘ src=‘jquery.js‘></script>
29   <script type="text/javascript">
30     $(function(){
31       var baseIndex=100;
32       $(‘#keybord‘).find(‘tr‘).each(function(r){
33         $(this).find(‘td‘).each(function(c){
34           $(this).find(‘input‘).attr(‘tabindex‘,r*100+c+baseIndex).addClass(‘tbInput‘);
35         });
36       });
37       $(‘#keybord .tbInput‘).live(‘keydown‘,function(evt){
38         var tabIndex=parseInt($(this).attr(‘tabindex‘));
39           switch(evt.which){
40             case 38://up
41               tabIndex-=100;
42               break;
43             case 40://down
44               tabIndex+=100;
45               break;
46             case 37://left
47               tabIndex--;
48               break;
49             case 39://right
50               tabIndex++;
51               break;
52             default:
53               return;
54           }
55           if(tabIndex>0){
56             $(‘#keybord .tbInput[tabindex]=‘+tabIndex+‘}‘).focus();
57             return false;
58           }
59           return true;
60       });
61     })
62   </script>
63 </body>
64 </html>
时间: 2024-10-10 08:42:41

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

vue.js 键盘enter事件的使用

在监听键盘事件时,我们经常需要检查常见的键值.Vue 允许为 v-on 在监听键盘事件时添加按键修饰符: <!-- 只有在 `keyCode` 是 13 时调用 `vm.submit()` --><input v-on:keyup.13="submit"> 记住所有的 keyCode 比较困难,所以 Vue 为最常用的按键提供了别名: <!-- 同上 --><input v-on:keyup.enter="submit"&g

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

作者:827969653 在网上查询的按键码如下: 一.键盘按键和键盘对应代码表:   字母按键码A <--------> 65 B <--------> 66 C <--------> 67 D <--------> 68 E <--------> 69 F <--------> 70 G <--------> 71 H <--------> 72 I <--------> 73 J <--

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

   前   言 絮叨絮叨 这里是JS基础知识集中讲解的第三篇,也是最后一篇,三篇JS的基础,大多是知识的罗列,并没有涉及更难得东西,干货满满!看完这一篇后,相信许多正在像我一样正处于初级阶段的同学,经过初步的学习,会对这一门语言有了一定深入的了解,也会感受到这一门语言的强大之处.希望各位同学通过一定的学习,会得到等大的收获. 因为是最后一篇所以内容可能有点多,希望各位同学能够慢慢看,细细看,让我们一起学习,一起进步,一起感受JS的魅力. 一函数 函数的声明及调用 1.函数的声明格式: func

笔记-[2]-JS键盘事件.

键盘事件主要有两种: onkeydown:当键盘按下的时候触发 onkeyup:当键盘按键抬起的时候触发 例子: <script type="text/javascript"> window.onload=function(){ var oTxt=document.getElementById('txt'); oTxt.onkeyup=function(ev){ var ev=ev || window.event; if(ev.keyCode==13 &&

js键盘监听操作

//js监听键盘事件 document.onkeydown = function (event) { var e = event || window.event || arguments.callee.caller.arguments[0]; alert(e.keyCode);//打印对应键盘的键值 if (e && e.keyCode == 13)//监听键盘Enter建 { } if (e && e.keyCode == 8)//监听键盘Backspace建 { } /

js 键盘事件

<script type="text/javascript" language=JavaScript charset="UTF-8"> document.onkeydown=function(event){ var e = event || window.event || arguments.callee.caller.arguments[0]; if(e && e.keyCode==27){ // 按 Esc //要做的事情 } if(

JS中的事件以及DOM 操作

[DOM树节点] DOM节点分为三大节点:元素节点,文本节点,属性节点. 文本节点,属性节点为元素节点的两个子节点通过getElment系列方法,可以去到元素节点 [查看节点] 1 document.getElementById("div1")  通过ID获取唯一的节点  多个同名ID只会取到第一个 2 getElmentsName   通过Name取到一个数组,包含1到多个节点   使用方式   通过循环,取到每一个节点  循环次数从0开始,<数组 length [查看和设置属

Web Js判断键盘出发事件

window.document.onkeydown = disableRefresh; function disableRefresh(evt){ evt = (evt) ? evt : window.event if (evt.keyCode) { if(evt.keyCode == 116){ //do something } } } keycode 8 = BackSpace BackSpace keycode 9 = Tab Tab keycode 12 = Clear keycode

JS实现 键盘操作

JS实现 键盘操作: 详情可以去其逛网查看其API并下载,地址:http://craig.is/killing/mice <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xh