js监控键盘上下左右的按下更换图片
js监控键盘上下左右的按下更换图片
tianhuahua 发表于4年前
js监控键盘上下左右的按下更换图片
  • 发表于 4年前
  • 阅读 49
  • 收藏 0
  • 点赞 0
  • 评论 0

腾讯云 技术升级10大核心产品年终让利>>>   

<html>
 <head>
  <title>js键盘事件监听</title>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
 </head>
    <Script language=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(){ 
   	  document.getElementById("testimg").src="./image/left.png";
     }
    function fun_b(){ 
    	document.getElementById("testimg").src="./image/up.png";
    }
    function fun_c(){ 
    	document.getElementById("testimg").src="./image/right.png";
    }
    function fun_d(){
    	document.getElementById("testimg").src="./image/down.png";
    } 
    document.onkeydown=jumpPage;

    </Script>
    
<body>
请选择键盘上上下左右箭头
 <img src="" id="testimg" />
</body>
</html>


共有 人打赏支持
粉丝 4
博文 18
码字总数 8749
×
tianhuahua
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: