Top
首页 > 老文章 > 正文

在JSP的页面上可以通过JavaScript来截获键盘的按键事件

在JSP的页面上可以通过JavaScript来截获键盘的按键事件

在JSP的页面上可以通过JavaScript来截获键盘的按键事件
发布时间:2006-04-19 13:08        来源:        作者:
页面中的键盘控制 

Capturing Keystrokes 
相应敲击键是电脑和人的基本相互作用。你可以控制任何一个键的按下和松开。首先我们先要
知道如何启动一个所谓的事件 (event). 下面是启动一个把键按下的"onkeydown" 的事件. 
document.onkeydown = keyDown 
这里的 keyDown 是你所要编写的相应键盘的子程序。当你的浏览器读了以上的语句, 它将会知
道哪个键被按下了,然后启动子程序 keyDown()。 子程序的名字随你起了,在这里在子程序名
字后面不需要括号。取得哪个键被按下却在Netscape 和 IE 有所不同。看以下代码,如果用的是
 Netscaep, 变量 nKey 将会得到 key code, 而让 ieKey 为 0. 相反, 如果用的是 IE, ieKey
  为 key code 而 nKey 为 0: 
代码:
function keyDown(e) {
        if (ns4) {
        var nKey=e.which; 
        var ieKey=0
        } 
       if (ie4) {
       var ieKey=event.keyCode; var nKey=0
       }
        alert("nKey:"+nKey+" ieKey:" + ieKey); 
    }
     document.onkeydown = keyDown 
     if (ns4) document.captureEvents(Event.KEYDOWN)  

用键盘移动元素 

假如你想用键盘来启动你的滑动, 你需要先知道哪个键被按了, 然后用相应的子程序来滑动元
素. 下面我们准备用 "A" 键来启动滑动子程序. Netscape 的 "A" 是 97. 而 IE 是 65. 也就
是说, nKey 为 97 而 ieKey 为 65. 
代码:
function init() {
 if (ns4) block = document.blockDiv 
 if (ie4) block = blockDiv.style
  block.xpos = parseInt(block.left) 
  document.onkeydown = keyDown 
  if (ns4) document.captureEvents(Event.KEYDOWN) 
 } 
 function keyDown(e) {
  if (ns4) {
  var nKey=e.which; var ieKey=0
  }
   if (ie4) {
   var ieKey=event.keyCode;
    var nKey=0
    }
     if (nKey==97 || ieKey==65) {
      // if "A" key is pressed slide() 
      } 
   }
 function slide() {
  if (block.xpos < 300) {
   block.xpos += 5 block.left = block.xpos status = block.xpos 
   // not needed, just for show 
   setTimeout("slide()",30)
    } 
  }  
  

启动变量 

我们这里介绍一种方法: 启动变量, 来控制滑动的停止和启动. 这个变量记录了元素是否在动
还是不动. 然后在滑动子程序里放置 "if" 语句, 根据这个启动变量的值来决定是否停止还是
继续滑动. 
代码:
function slide() {
 if (myobj.active) {
  myobj.xpos += 5 
  myojb.left = myobj.xpos 
  setTimeout("slide()",30) 
  }
}  

使用 onKeyUp 和启动变量来控制滑动 

onkeyup 就是 onkeydown 相反, 也就是说它用来对键起来这个事件做出反应的. 
代码:
document.onkeydown = keyDown 
document.onkeyup = keyUp if (ns4) 
document.captureEvents(Event.KEYDOWN | Event.KEYUP)  

下面就是一个完整的程序代码:
CODE:

function init() {
 if (ns4) block = document.blockDiv 
 if (ie4) block = blockDiv.style
  block.xpos = parseInt(block.left) 
  block.active = false 
  document.onkeydown = keyDown 
  document.onkeyup = keyUp 
  if (ns4) document.captureEvents(Event.KEYDOWN | Event.KEYUP) } 
  
  function keyDown(e) { 
  if (ns4) {
  var nKey=e.which; var ieKey=0
  } 
  if (ie4) {
  var ieKey=event.keyCode; var nKey=0
  } 
  if ((nKey==97 || ieKey==65) && !block.active) { 
  // if "A" key is pressed 
  block.active = true slide() 
    } 
  } 
  function keyUp(e) { 
  if (ns4) {
  var nKey=e.which; var ieKey=0
  }
   if (ie4) {
   var ieKey=event.keyCode;
    var nKey=0} 
   if (nKey==97 || ieKey==65) {
    block.active = false // if "A" key is released
     } 
   }
 
  function slide() { 
  if (block.active) { 
  block.xpos += 5 
  block.left = block.xpos 
  status = block.xpos // not needed, just for show 
  setTimeout("slide()",30)
   } 
 }  

加载更多

专题访谈

合作站点
stat