网站地图    收藏   

主页 > 前端 > javascript >

js中响应上、下键enter键程序代码

来源:自学PHP网    时间:2014-09-19 14:47 作者: 阅读:

[导读] 在有些网页中我们希望用户按回车就可以提交数据或禁止按回车提交数据,下面我来到介绍一个js响应上、下键enter键程序代码....

 代码如下 复制代码

<script type="text/javascript" charset="utf-8">
  function response(obj){
   var $list = $(obj);
   var $children = $list.children();
   var num= $children.size();//$list  总个数
   var current=0; //当前选中项
   addnow()
   $(document).bind('keydown',function(e){
    if($list.is(":visible")){
     if(e.keyCode == 40){ //向下
      if(current<num -1) current = current +1;
      addnow()
      e.preventDefault();
     }else if(e.keyCode ==38 ){//向上
      if(current > 0)current= current -1;
      addnow()
      e.preventDefault();
     }else if(e.keyCode == 13){
      var url = $children.eq(current).find('a').attr('href');
      document.location= url;
     }
    }else{
     current = 0;
     addnow()
    }
   });

   function addnow(){
    $children.eq(current).addClass('now').siblings().removeClass('now');
   }

  }

  response('#ul');

一些常用的按钮对应编辑

Key Pressed Javascript Key Code
backspace 8
tab 9
enter 13
shift 16
ctrl 17
alt 18
pause/break 19
caps lock 20
escape 27
page up 33
page down 34
end 35
home 36
left arrow 37
up arrow 38
right arrow 39
down arrow 40
insert 45
delete 46
0 48
1 49
2 50
3 51
4 52
5 53
6 54
7 55
8 56
9 57
a 65
b 66
c 67
d 68
e 69
f 70
g 71
h 72
i 73
j 74
k 75
l 76
m 77
n 78
o 79
p 80
q 81
r 82
s 83
t 84
u 85
v 86
w 87
x 88
y 89
z 90
left window key 91
right window key 92
select key 93
numpad 0 96
numpad 1 97
numpad 2 98
numpad 3 99
numpad 4 100
numpad 5 101
numpad 6 102
numpad 7 103
numpad 8 104
numpad 9 105
multiply 106
add 107
subtract 109
decimal point 110
divide 111
f1 112
f2 113
f3 114
f4 115
f5 116
f6 117
f7 118
f8 119
f9 120
f10 121
f11 122
f12 123
num lock 144
scroll lock 145
semi-colon 186
equal sign 187
comma 188
dash 189
period 190
forward slash 191
grave accent 192
open bracket 219
back slash 220
close braket 221
single quote 222

自学PHP网专注网站建设学习,PHP程序学习,平面设计学习,以及操作系统学习

京ICP备14009008号-1@版权所有www.zixuephp.com

网站声明:本站所有视频,教程都由网友上传,站长收集和分享给大家学习使用,如由牵扯版权问题请联系站长邮箱904561283@qq.com

添加评论