关于键盘事件中keyCode、which和charCode 的兼容性测试

 

说在Firefox和IE下取到的keyCode不一样,在FF下不区分大小写键。
http://www.dodo.hk/article.asp?id=369
修改了下测试,想回复一下的,结果提示字数太多贴不了,就写到这吧:)

测试结果
在IE下:
>> 支持keyCode
>> 不支持which和charCode,二者值为 undefined

在Firefox下:
>> 支持keyCode,除功能键外,其他键值始终为 0
>> 支持which和charCode,二者的值相同

在Opera下:
>> 支持keyCode和which,二者的值相同
>> 不支持charCode,值为 undefined

测试代码
  1. <script type="text/javascript">
  2. //By 枫岩@CnLei.Com
  3. function $(s){
  4.   return document.getElementById(s)?document.getElementById(s):s;
  5. }
  6. function viewKeyInfo(e){
  7.   var currKey=0,CapsLock=0;
  8.   var e=e||event;
  9.   currKey=e.keyCode||e.which||e.charCode;
  10.   CapsLock=currKey >=65 && currKey <=90;
  11.   $("type").innerHTML=e['type'];
  12.   $("currKey").innerHTML=String.fromCharCode(currKey);
  13.   $("Decimal").innerHTML=currKey;
  14.   $("keyCode").innerHTML=e['keyCode'];
  15.   $("charCode").innerHTML=e['charCode'];
  16.   $("caps").innerHTML=CapsLock;
  17.   $("shiftKey").innerHTML=e['shiftKey'];
  18.   $("ctrlKey").innerHTML=e['ctrlKey'];
  19.   $("repeat").innerHTML=e['repeat'];
  20.   $("which").innerHTML=e['which'];
  21. }
  22. document.onkeypress= viewKeyInfo;
  23. </script>
  24. <p>请按下任意键看测试效果:</p>
  25. type:<span id="type"></span><br />
  26. 当前Key:<span id="currKey"></span><br />
  27. Decimal:<span id="Decimal"></span><br />
  28. keyCode:<span id="keyCode"></span> <strong>注:在FF下,keyCode始终为0</strong><br />
  29. which:<span id="which"></span> <strong>注:在IE下,which始终为undefined ; 在Opera下,keyCode和charCode二者的值相同</strong><br />
  30. charCode:<span id="charCode"></span> <strong>注:在IE、Opera下,charCode始终为undefined ; 在FF下,which和charCode二者的值相同</strong><br />
  31. 大写:<span id="caps"></span><br />
  32. altKey:<span id="altKey"></span><br />
  33. ctrlKey:<span id="ctrlKey"></span><br />
  34. shiftKey:<span id="shiftKey"></span><br />
  35. repeat:<span id="repeat"></span><br />
  36. <style type="text/css" media="all">
  37. body {color:#999;font:normal 14px tahoma,宋体,Geneva,Arial,sans-serif;}
  38. span {color:#f00;font-weight:bold;padding:0 5px;}
  39. strong {color:#090;font-weight:normal;padding:0 5px;}
  40. </style>

作者:水木    
 
原文地址:https://www.cnblogs.com/hsapphire/p/1627047.html