熱點推薦:
您现在的位置: 電腦知識網 >> 編程 >> Java編程 >> JSP教程 >> 正文

javascript的鍵盤控制事件

2013-11-15 11:51:20  來源: JSP教程 

  獲取鍵盤控制事件是實現交互性最有力的方法之一
  
   首先需要了解的是如何初始化該事件基本語句如下
  
   documentonkeydown = keyDown
  
   當浏覽器讀到這個語句時無論按下鍵盤上的哪個鍵都將呼叫KeyDown()函數
  
   捕獲鍵盤事件對於不同的浏覽器來說有點困難我們分別的來學習不同浏覽器的實現語句
  
   Netscape
  
   Netscape的程序實現要比IE麻煩你必須放一個特別的語句來使Netscape始終去檢查擊鍵事件如果沒有這行語句擊鍵事件將與按下鼠標事件搞混特別語句如下
  
   documentonkeydown = keyDown
  if (ns) documentcaptureEvents(EventKEYDOWN)
  
   keyDown()函數有一個隱藏的變量一般的我們使用字母e來表示這個函數
  
   function keyDown(e)
  
    變量e表示發生擊鍵事件尋找是哪個鍵被按下使用以下屬性
  
    ewhich
  
    這將給出該鍵的索引值把索引值轉化成該鍵的字母或數字值
  
    StringfromCharCode(ewhich)
  
    把上面的語句放在一起我們可以知道被按下的是哪一個鍵 
   
   function keyDown(e) {
   var keycode = ewhich
   var realkey = StringfromCharCode(ewhich)
   alert(keycode: + keycode + realkey: + realkey)
  } 
   
  documentonkeydown = keyDown
  documentcaptureEvents(EventKEYDOWN)

  Internet Explorer
  
   IE的程序與Netscape類似但它不需要e變量用windoweventkeyCode來代替ewhich把鍵的索引值轉化為真實鍵值方法類似StringfromCharCode(eventkeyCode)程序如下
  
   function keyDown() {
   var keycode = eventkeyCode
   var realkey = StringfromCharCode(eventkeyCode)
   alert(keycode: + keycode + realkey: + realkey)
  }
  documentonkeydown = keyDown
  documentonkeydown = keyDown
  
   適用於兩者的程序
  
   用兩種浏覽器檢查上述實例你會發現執行結果不總是一樣的這是因為兩種浏覽器的鍵盤代碼設置不相同因此你必須使用單獨的代碼分別來寫這段程序而毫無別法
  
   建議你要完全忘掉實際的鍵值僅僅使用鍵盤的代碼值來工作下面這段程序將視情況而設置如果是用IE的話ieKey生效把nKey設為如果是用Netscape的話nKey生效把nKey設為然後用一個警示框來顯示兩者的值
  
     function keyDown(e) {
    if (ns) {
     var nKey=ewhich;
     var ieKey=
    }
    if (ie) {
     var ieKey=eventkeyCode;
     var nKey=
    }
    alert(nKey:+nKey+ ieKey: + ieKey)
  }
  documentonkeydown = keyDown
  if (ns) documentcaptureEvents(EventKEYDOWN)
  
   使用鍵盤移動對象
  
   下面的程序實現用鍵盤移動對象程序將檢查哪一個鍵被按下從而調用相應的函數來移動對象本例中當字母A被按下時對象就開始移動字母A鍵在nKey中的值是ieKey的值為在程序中將分別檢查這兩個值

  function init() {
    if (ns) block = documentblockDiv
    if (ie) block = blockDivstyle
    blockxpos = parseInt(blockleft)
    documentonkeydown = keyDown
    if (ns) documentcaptureEvents(EventKEYDOWN)
  }
  function keyDown(e) {
    if (ns) { var nKey=ewhich; var ieKey= }
    if (ie) { var ieKey=eventkeyCode; var nKey= }
    if (nKey== || ieKey==) { // 如果A鍵按下
      slide()
    }
  }
  function slide() {
    blockxpos +=
    blockleft = blockxpos
    status = blockxpos // 這一句不一定需要只是為了檢查狀態
    setTimeout(slide())
  }
  
   增加 Active變量
  
   上面程序稍微有些不足對象移動以後就無法使它停止了而且當你多按幾次A鍵時物體將運動得越來越快這裡我們來修補它
  
   使用變量active來改變這種情況插入if語句來檢查函數是否重復
  
     function slide() {
    if (myobjactive) {
    myobjxpos +=
    myojbleft = myobjxpos
    setTimeout(slide())
    }
  }
  
   在這種情況中slide()函數只有在myobjactive值為真的時候才會工作當myobjactive值為假時對象將停止移動
  
   使用 onKeyUp 和 Active 變量

  onkeyup事件和onkeydown事件工作原理相同用以下語句初始化該事件: 
   
  documentonkeydown = keyDown
  documentonkeyup = keyUp
  if (ns) documentcaptureEvents(EventKEYDOWN | EventKEYUP) 
   
  keyUp() 函數與之相同當一個鍵被放開時事件被激發對象停止移動並將active變量置為
  
     function keyUp(e) {
    if (ns) var nKey = ewhich
    if (ie) var ieKey = windoweventkeyCode
    if (nKey== || ieKey==)
    blockactive = false
  }
  
   下面是比較完整的程序
  
     function init() {
    if (ns) block = documentblockDiv
    if (ie) block = blockDivstyle
    blockxpos = parseInt(blockleft)
    blockactive = false
    documentonkeydown = keyDown
    documentonkeyup = keyUp
    if (ns) documentcaptureEvents(EventKEYDOWN | EventKEYUP)
  }
  function keyDown(e) {
    if (ns) {var nKey=ewhich; var ieKey=}
    if (ie) {var ieKey=eventkeyCode; var nKey=}
    if ((nKey== || ieKey==) && !blockactive) { // if A key is pressed
      blockactive = true slide()
    }
  }
  function keyUp(e) {
    if (ns) {var nKey=ewhich; var ieKey=}


From:http://tw.wingwit.com/Article/program/Java/JSP/201311/19754.html
  • 上一篇文章:

  • 下一篇文章:
  • 推薦文章
    Copyright © 2005-2013 電腦知識網 Computer Knowledge   All rights reserved.