九色国产,午夜在线视频,新黄色网址,九九色综合,天天做夜夜做久久做狠狠,天天躁夜夜躁狠狠躁2021a,久久不卡一区二区三区

打開APP
userphoto
未登錄

開通VIP，暢享免費(fèi)電子書等14項(xiàng)超值服

開通VIP

首頁(yè)

好書

留言交流

下載APP

聯(lián)系客服
js獲取鍵盤（上下左右）方向鍵，執(zhí)行相應(yīng)操作
JS獲取鍵盤方向鍵，然后執(zhí)行相應(yīng)的響應(yīng)事件。以一個(gè)簡(jiǎn)單的圖片的左右切換為例，代碼如下：

 

  1. <html xmlns="http://www.w3.org/1999/xhtml">   
  2. <head>   
  3. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />   
  4. <title>無標(biāo)題文檔</title>   
  5. <mce:style type="text/css"><!--   
  6. .list {   
  7.     font-size:20px;   
  8.     text-align:center;   
  9.     line-height:40px;   
  10. }   
  11. --></mce:style><style type="text/css" mce_bogus="1">.list {   
  12.     font-size:20px;   
  13.     text-align:center;   
  14.     line-height:40px;   
  15. }</style>   
  16.   
  17. <mce:script type="text/javascript"><!--   
  18. var menuArray = [   
  19.     {info:"欄目一",url:"#"},   
  20.     {info:"欄目二",url:"#"},   
  21.     {info:"欄目三",url:"#"},   
  22.     {info:"欄目四",url:"#"}   
  23. ];   
  24.   
  25. var menuPos = 0;   
  26. var menuSize = 4;   
  27.   
  28. function $(id){   
  29.     return document.getElementById(id);   
  30. }   
  31.   
  32. function showMenu(){   
  33.     for(var i=0;i<menuSize;i++){   
  34.         $("menu"+i).innerHTML = menuArray[i].info;   
  35.         $("menu"+i).style.backgroundImage = "url(menu_focus0.gif)";   
  36.     }   
  37. }   
  38.   
  39. function menuFocus(num){   
  40.     //$("menu"+menuPos).style.backgroundColor = "#CCCCCC";   
  41.     $("menu"+menuPos).style.backgroundImage = "url(menu_focus0.gif)";   
  42.     $("menu"+menuPos).style.color = "#000000";   
  43.     $("menu"+menuPos).style.fontSize = "20px";   
  44.     menuPos+=num;   
  45.        
  46.     if(menuPos>menuArray.length-1) menuPos=0;   
  47.     else if(menuPos<0) menuPos=menuArray.length-1;   
  48.   
  49.     //$("menu"+menuPos).style.backgroundColor = "#00CCFF";   
  50.     $("menu"+menuPos).style.backgroundImage = "url(menu_focus1.gif)";   
  51.     $("menu"+menuPos).style.color = "#FFFFFF";   
  52.     $("menu"+menuPos).style.fontSize = "30px";   
  53. }   
  54.   
  55. function deSelect(){   
  56.     location.href = menuArray[menuPos].url;   
  57. }   
  58.   
  59. function init(){   
  60.     showMenu();   
  61.     menuFocus(0);   
  62. }   
  63.   
  64. document.onsystemevent = grabEvent;   
  65. document.onkeypress = grabEvent;   
  66. document.onirkeypress = grabEvent;   
  67. document.onkeyup = grabEvent;   
  68. function grabEvent(){   
  69.     var keycode = event.which||event.keyCode;   
  70.     switch(keycode){   
  71.         case 1:   
  72.         case 38:   
  73.         case 269: //up   
  74.             return 0;   
  75.             break;   
  76.         case 40:   
  77.         case 2:   
  78.         case 270: //down   
  79.             return 0;   
  80.             break;   
  81.         case 37:   
  82.         case 3:   
  83.         case 271: //left   
  84.             menuFocus(-1);   
  85.             return 0;   
  86.             break;   
  87.         case 39:   
  88.         case 4:   
  89.         case 272: //right   
  90.             menuFocus(1);   
  91.             return 0;   
  92.             break;   
  93.         case 13: //enter   
  94.             deSelect();   
  95.             return 0;   
  96.             break;   
  97.         case 339: //exit   
  98.         case 340: //back   
  99.             location.href = "../index.htm";   
  100.             return 0;   
  101.             break;   
  102.     }   
  103. }   
  104. // --></mce:script>   
  105. </head>   
  106.   
  107. <body leftmargin="0" topmargin="0" onload="init()">   
  108. <div style="position:absolute; left:0px; top:0px; width:640px; height:50px; line-height:50px; font-size:30px; color:#FFFFFF; text-align:center; background:#00CCFF;">菜單交互（背景交互）</div>   
  109.   
  110. <div style="position:absolute; left:0px; top:100px; width:640px; height:40px;">   
  111. <table width="620" border="0" align="center" cellpadding="0" cellspacing="0">   
  112.   <tr>   
  113.     <td width="140" height="40" class="list" id="menu0"></td>   
  114.     <td width="20"></td>   
  115.     <td width="140" class="list" id="menu1"></td>   
  116.     <td width="20"></td>   
  117.     <td width="140" class="list" id="menu2"></td>   
  118.     <td width="20"></td>   
  119.     <td width="140" class="list" id="menu3"></td>   
  120.   </tr>   
  121. </table>   
  122. </div>   
  123. </body>   
  124. </html>  

 

其中：document.onkeyup = grabEvent;是獲取鍵盤按鍵的響應(yīng)事件，
function grabEvent(){
 var keycode = event.which||event.keyCode;
 switch(keycode){

      case 37://left功能；

           alert（“←方向鍵被按下”）；

      case 38://up

      case 39://right

      case 40://down
}

可以在case里寫對(duì)應(yīng)的按鍵相應(yīng)的方法或者功能。

本站僅提供存儲(chǔ)服務(wù)，所有內(nèi)容均由用戶發(fā)布，如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容，請(qǐng)點(diǎn)擊舉報(bào)。
打開APP，閱讀全文并永久保存 查看更多類似文章
猜你喜歡
類似文章
JavaScript 實(shí)現(xiàn)模態(tài)對(duì)話框 源代碼大全
華東游·南京<上>（2015年）
圖文：古籍之《呂祖生生數(shù)》
愛的痕跡（陳瑞最動(dòng)聽的傷感歌曲50首）
精美的工藝掛屏藝術(shù)品2
太漂亮了，實(shí)在太漂亮了，送給親愛的你！
更多類似文章 >>
生活服務(wù)
熱點(diǎn)新聞
分享 收藏 導(dǎo)長(zhǎng)圖 關(guān)注 下載文章
綁定賬號(hào)成功
后續(xù)可登錄賬號(hào)暢享VIP特權(quán)！
如果VIP功能使用有故障，
可點(diǎn)擊這里聯(lián)系客服！

聯(lián)系客服