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

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

 

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

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

 

测试代码如下:

 

<script type="text/javascript">
//By 枫岩@IECN.Net
function $(s){
  return document.getElementById(s)?document.getElementById(s):s;
}
function viewKeyInfo(e){   
  var currKey=0,CapsLock=0;
  var e=e||event;
  currKey=e.keyCode||e.which||e.charCode;
  CapsLock=currKey >=65 && currKey <=90;
  $("type").innerHTML=e['type'];
  $("currKey").innerHTML=String.fromCharCode(currKey);
  $("Decimal").innerHTML=currKey;
  $("keyCode").innerHTML=e['keyCode'];
  $("charCode").innerHTML=e['charCode'];
  $("caps").innerHTML=CapsLock;
  $("shiftKey").innerHTML=e['shiftKey'];
  $("ctrlKey").innerHTML=e['ctrlKey'];
  $("repeat").innerHTML=e['repeat'];
  $("which").innerHTML=e['which'];
}

 

document.onkeypress= viewKeyInfo;
</script>
<p>请按下任意键看测试效果:</p>
type:<span id="type"></span>
 
当前Key:<span id="currKey"></span>
 
Decimal:<span id="Decimal"></span>
 
keyCode:<span id="keyCode"></span> <strong>注:在FF下,keyCode始终为0</strong>
 
which:<span id="which"></span> <strong>注:在IE下,which始终为undefined ; 在Opera下,keyCode和charCode二者的值相同</strong>
 
charCode:<span id="charCode"></span> <strong>注:在IE、Opera下,charCode始终为undefined ; 在FF下,which和charCode二者的值相同</strong>
 
大写:<span id="caps"></span>
 
altKey:<span id="altKey"></span>
 
ctrlKey:<span id="ctrlKey"></span>
 
shiftKey:<span id="shiftKey"></span>
 
repeat:<span id="repeat"></span>
 
<style type="text/css" media="all">
body {color:#999;font:normal 14px tahoma,宋体,Geneva,Arial,sans-serif;}
span {color:#f00;font-weight:bold;padding:0 5px;}
strong {color:#090;font-weight:normal;padding:0 5px;}
</style>

你可能感兴趣的:(keycode)