使用JavaScript和jQuery,跨浏览器处理按键事件(F1-F12)

我想使用JavaScript和jQuery处理F1-F12键.

我不确定要避免哪些陷阱,我目前无法在除Internet Explorer 8,Google Chrome和Mozilla FireFox 3之外的任何其他浏览器中测试实现.

对完整的跨浏览器解决方案的任何建议？像一个经过充分测试的jQuery库或者只是vanilla jQuery/JavaScript？

我同意William的观点,一般来说劫持功能键是个坏主意.也就是说,我找到了一个快捷方式库,它以非常灵活的方式添加了这个功能,以及其他键盘快捷键和组合.

单键击:

shortcut.add("F1", function() {
    alert("F1 pressed");
});

击键组合:

shortcut.add("Ctrl+Shift+A", function() {
    alert("Ctrl Shift A pressed");
});

我不确定是否可以截取功能键,但我会避免一起使用功能键.浏览器使用功能键来执行各种任务,其中一些非常常见.例如,在Linux上的Firefox中,至少有六或七个功能键保留供浏览器使用:

F1(帮助),

F3(搜索),

F5(刷新),

F6(焦点地址栏),

F7(插入符号浏览模式),

F11(全屏模式),和

F12(由几个插件使用,包括Firebug)

最糟糕的是,不同操作系统上的不同浏览器对不同的东西使用不同的密钥.这需要考虑很多差异.你应该坚持使用更安全,不常用的键组合.

我对这类问题的最佳来源是这个页面:http://www.quirksmode.org/js/keys.html

他们所说的是关键代码在Safari上是奇怪的,并且在其他地方都是一致的(除了在IE上没有按键事件,但我相信keydown工作).

哇,这很简单.我应该写这个,为什么以前没有人这么做？

$(function(){
    //Yes! use keydown 'cus some keys is fired only in this trigger,
    //such arrows keys
    $("body").keydown(function(e){
         //well you need keep on mind that your browser use some keys 
         //to call some function, so we'll prevent this
         e.preventDefault();

         //now we caught the key code, yabadabadoo!!
         var keyCode = e.keyCode || e.which;

         //your keyCode contains the key code, F1 to F12 
         //is among 112 and 123. Just it.
         console.log(keyCode);       
    });
});

没有其他外部类,您只需使用即可创建个人黑客代码

event.keyCode

对于所有人的另一个帮助,我认为这个测试页面用于拦截keyCode(只需复制并在新file.html中过去以测试您的事件).

 
 
 
 
 
 
 
 
 

 

 
onkeydown
onkeyup
onkeypress
 
 

 
keyCode
 
 
 
 
 

 
charCode
 
 
 
 
 
 CLEAR
 
 

这是一个工作演示,所以你可以在这里试试:

var t_cel, tc_ln;
if (document.addEventListener) { //code for Moz
  document.addEventListener("keydown", keyCapt, false);
  document.addEventListener("keyup", keyCapt, false);
  document.addEventListener("keypress", keyCapt, false);
} else {
  document.attachEvent("onkeydown", keyCapt); //code for IE
  document.attachEvent("onkeyup", keyCapt);
  document.attachEvent("onkeypress", keyCapt);
}

function keyCapt(e) {
  if (typeof window.event != "undefined") {
    e = window.event; //code for IE
  }
  if (e.type == "keydown") {
    t_cel[0].innerHTML = e.keyCode;
    t_cel[3].innerHTML = e.charCode;
  } else if (e.type == "keyup") {
    t_cel[1].innerHTML = e.keyCode;
    t_cel[4].innerHTML = e.charCode;
  } else if (e.type == "keypress") {
    t_cel[2].innerHTML = e.keyCode;
    t_cel[5].innerHTML = e.charCode;
  }
}
window.onload = function() {
  t_cel = document.getElementById("tblOne").getElementsByTagName("td");
  tc_ln = t_cel.length;
}

td,
th {
  border: 2px solid #aaa;
}

  
  



  

    

      

      
onkeydown
      
onkeyup
      
onkeypress
    
    

      
keyCode
      
 
      
 
      
 
    
    

      
charCode
      
 
      
 
      
 
    
  
  CLEAR