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 获取浏览器高度和宽度值(多浏览器)
Sep 02 Javascript
基于JQuery的Pager分页器实现代码
Jul 17 Javascript
使用JavaScript动态设置样式实现代码(2)
Jan 25 Javascript
JavaScript变量声明详解
Nov 27 Javascript
兼容主流浏览器的JS复制内容到剪贴板
Dec 12 Javascript
JavaScript实现获取某个元素相邻兄弟节点的prev与next方法
Jan 25 Javascript
JSON字符串和对象相互转换实例分析
Jun 16 Javascript
浅谈JavaScript find 方法不支持IE的问题
Sep 28 Javascript
浅谈JS 数字和字符串之间相互转化的纠纷
Oct 20 Javascript
深入了解javascript 数组的sort方法
Jun 01 Javascript
JavaScript数组去重的几种方法
Apr 07 Javascript
基于openlayers实现角度测量功能
Sep 28 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 split()函数的用法详解
2013/06/05 PHP
解析php中获取url与物理路径的总结
2013/06/21 PHP
根据分辨率不同,调用不同的css文件
2006/07/07 Javascript
javascript中Function类型详解
2015/04/28 Javascript
jQuery使用$获取对象后检查该对象是否存在的实现方法
2016/09/04 Javascript
微信小程序 location API接口详解及实例代码
2016/10/12 Javascript
js阻止冒泡和默认事件(默认行为)详解
2016/10/20 Javascript
解决Angular.Js与Django标签冲突的方案
2016/12/20 Javascript
详解angular中如何监控dom渲染完毕
2017/01/03 Javascript
JavaScript判断浏览器及其版本信息
2017/01/20 Javascript
JS字符串按逗号和回车分隔的方法
2017/04/25 Javascript
jQuery Ajax自定义分页组件(jquery.loehpagerv1.0)实例详解
2017/05/01 jQuery
详解vue-resource promise兼容性问题
2017/06/20 Javascript
详解vue.js之绑定class和style的示例代码
2017/08/24 Javascript
vue 监听某个div垂直滚动条下拉到底部的方法
2018/09/15 Javascript
JS数组实现分类统计实例代码
2018/09/30 Javascript
uploadify插件实现多个图片上传并预览
2019/09/30 Javascript
javascript事件循环event loop的简单模型解释与应用分析
2020/03/14 Javascript
vue计算属性+vue中class与style绑定(推荐)
2020/03/30 Javascript
JQuery通过键盘控制键盘按下与松开触发事件
2020/08/07 jQuery
vue 子组件和父组件传值的示例
2020/09/11 Javascript
[50:59]2018DOTA2亚洲邀请赛 4.7 总决赛 LGD vs Mineski第四场
2018/04/10 DOTA
[39:07]LGD vs VP 2018国际邀请赛淘汰赛BO3 第二场 8.21
2018/08/22 DOTA
使用Node.js和Socket.IO扩展Django的实时处理功能
2015/04/20 Python
Python 搭建Web站点之Web服务器网关接口
2016/11/06 Python
Django 如何获取前端发送的头文件详解(推荐)
2017/08/15 Python
Python 循环语句之 while,for语句详解
2018/04/23 Python
python模块smtplib实现纯文本邮件发送功能
2018/05/22 Python
python 给DataFrame增加index行名和columns列名的实现方法
2018/06/08 Python
Python爬虫实现爬取百度百科词条功能实例
2019/04/05 Python
Python文件操作基础流程解析
2020/03/19 Python
python 实现弹球游戏的示例代码
2020/11/17 Python
仓库文员岗位职责
2014/04/06 职场文书
助理政工师申报材料
2014/06/03 职场文书
巾帼志愿者活动方案
2014/08/17 职场文书
2016年小学“感恩教师”主题队日活动总结
2016/04/01 职场文书