js键盘上下左右键怎么触发function(实例讲解)


Posted in Javascript onDecember 14, 2013
<script type="text/javascript">
 function jumpPage() { 
    if (event.keyCode==37)//左 
fun_a(); 
if (event.keyCode==38)//上
 fun_b();
 if (event.keyCode==39)//右 
fun_c(); 
if (event.keyCode==40)//下 
fun_d();
 } 

 
function fun_a(){ 
window.alert('你按下了左')
 } 
function fun_b(){ 
window.alert('你按下了上')
} 
function fun_c(){ 
window.alert('你按下了右') 
} 
function fun_d(){
 window.alert('你按下了下') 
} 
document.onkeydown=jumpPage;
</script>

HTML code
<table width="100%" border="1" cellspacing="1" cellpadding="0" id=table> <tr id="lineone" style="background-color:#00cccc;"> <td id=aa height="23"> </td> <td id=aa >按向下键</td> <td id=cc >按向下键</td> <td id=dd >按向下键</td> <td id=ee >按向下键</td> </tr> <tr id="linetwo" tyle="background-color:#ffffff;"> <td id=a height="23"> </td> <td id=b >按向上键</td> <td id=c >按向上键</td> <td id=d >按向上键</td> <td id=e >按向上键</td> </tr></table><script language="javascript"> function keyDown(e) { var iekey=event.keyCode; action(iekey); } document.onkeydown = keyDown; function action(iekey) { if(iekey==40) { lineone.style.backgroundColor = ""; linetwo.style.backgroundColor = "#00cccc"; } if(iekey==38) { lineone.style.backgroundColor = "#00cccc"; linetwo.style.backgroundColor = ""; } } </script><input name="id" type="hidden" id="id" value
Javascript 相关文章推荐
JS 文件大小判断的实现代码
Apr 07 Javascript
jQuery中的bind绑定事件与文本框改变事件的临时解决方法
Aug 13 Javascript
js select option对象小结
Dec 20 Javascript
为开发者准备的10款最好的jQuery日历插件
Feb 04 Javascript
jQuery实现鼠标经过图片预览大图效果
Apr 10 Javascript
基于jquery css3实现点击动画弹出表单源码特效
Aug 31 Javascript
JSON遍历方式实例总结
Dec 07 Javascript
JS实现的自定义显示加载等待图片插件(loading.gif)
Jun 17 Javascript
jquery easyui dataGrid动态改变排序字段名的方法
Mar 02 Javascript
详解vue+vueRouter+webpack的简单实例
Jun 17 Javascript
Bootstrap Fileinput 4.4.7文件上传实例详解
Jul 25 Javascript
微信浏览器左上角返回按钮监听的实现
Mar 04 Javascript
js 上下左右键控制焦点(示例代码)
Dec 14 #Javascript
利用JS来控制键盘的上下左右键(示例代码)
Dec 14 #Javascript
JS短路原理的应用示例 精简代码的途径
Dec 13 #Javascript
代码触发js事件(click、change)示例应用
Dec 13 #Javascript
jquery获得option的值和对option进行操作
Dec 13 #Javascript
jquery遍历筛选数组的几种方法和遍历解析json对象
Dec 13 #Javascript
jquery改变disabled的boolean状态的三种方法
Dec 13 #Javascript
You might like
php代码检查代理ip的有效性
2016/08/19 PHP
php mysql操作mysql_connect连接数据库实例详解
2016/12/26 PHP
关于PHP转换超过2038年日期出错的问题解决
2017/06/28 PHP
php实现的pdo公共类定义与用法示例
2017/07/19 PHP
PHP基于PDO扩展操作mysql数据库示例
2018/12/24 PHP
PHP实现图片防盗链破解操作示例【解决图片防盗链问题/反向代理】
2020/05/29 PHP
ExtJs之带图片的下拉列表框插件
2010/03/04 Javascript
Visual Studio中的jQuery智能提示设置方法
2010/03/27 Javascript
jquery 取子节点及当前节点属性值
2014/07/25 Javascript
js控制文本框输入的字符类型方法汇总
2015/06/19 Javascript
《JavaScript函数式编程》读后感
2015/08/07 Javascript
javascript嵌套函数和在函数内调用外部函数的区别分析
2016/01/31 Javascript
实现JavaScript高性能的数据存储
2016/12/11 Javascript
zTree节点文字过多的处理方法
2017/11/24 Javascript
JS获取动态添加元素的方法详解
2019/07/31 Javascript
[04:23]DOTA2上海特锦赛小组赛第一日 TOP10精彩集锦
2016/02/27 DOTA
[02:27]2018DOTA2亚洲邀请赛趣味视频之钓鱼大赛 谁是垂钓冠军?
2018/04/05 DOTA
浅谈python中的正则表达式(re模块)
2017/10/17 Python
python代码实现ID3决策树算法
2017/12/20 Python
Python常见工厂函数用法示例
2018/03/21 Python
基于python神经卷积网络的人脸识别
2018/05/24 Python
Python函数基础实例详解【函数嵌套,命名空间,函数对象,闭包函数等】
2019/03/30 Python
pandas计算最大连续间隔的方法
2019/07/04 Python
Python  Django 母版和继承解析
2019/08/09 Python
Python流程控制 while循环实现解析
2019/09/02 Python
torch 中各种图像格式转换的实现方法
2019/12/26 Python
python与mysql数据库交互的实现
2020/01/06 Python
python GUI库图形界面开发之PyQt5线程类QThread详细使用方法
2020/02/26 Python
如何教少儿学习Python编程
2020/07/10 Python
python实现mask矩阵示例(根据列表所给元素)
2020/07/30 Python
python 求两个向量的顺时针夹角操作
2021/03/04 Python
书法比赛获奖感言
2014/02/10 职场文书
2014年干部作风建设总结
2014/10/23 职场文书
会计工作能力自我评价
2015/03/05 职场文书
答谢酒会主持词
2015/07/02 职场文书
使用CSS设置滚动条样式
2022/01/18 HTML / CSS