歡迎來到Linux教程網
Linux教程網
Linux教程網
Linux教程網
Linux教程網 >> Linux編程 >> Linux編程 >> Chrome中的onkeypress 的keyCode Bug

Chrome中的onkeypress 的keyCode Bug

日期:2017/3/1 9:43:36   编辑:Linux編程

在Chrome中onkeypress的keyCode和onkeydown中的keyCode並不一致...

其中onkeypress無法捕獲F1~F12,onkeydown可以捕獲

onkeypress捕獲a-z時區分大小寫,onkeydown不區分大小寫。

最主要的一個問題就在於a-z的大小寫,由於onkeypress不捕獲F1~F12,但是區分a-z的大小寫。而且直接用的字母的ascii碼,就導致小寫字母的一部分keyCode覆蓋了F1~F12,因而判斷這裡的keyCode的時候,會發生混亂。

如下測試(輸入的abctuvABCTUV):

可以看到在輸入小寫字母的時候,keypress和keydown完全不一樣,在輸入大寫字母的時候,兩者是一致的。

因而,在使用時必須注意。在Chrome和IE中使用keydown完全能達到要求,似乎在firefox中需要用keypress,如果想要兩者都兼容怎麼辦?

千萬不要同時寫keypress和keydown,這樣在你輸入小寫字母“t"的時候,說不定就引發了F5刷新的效果。

至於應該怎麼做,還是建議判斷浏覽器,然後設置對應的事件。

最後附上測試代碼:

<!doctype html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>KeyPress Test</title>
<script>
document.onkeypress = keypress;
function keypress() {
document.getElementById('keypress').value += '\n' + ('keyCode:'+event.keyCode);
}
document.onkeydown = keydown;
function keydown() {
document.getElementById('keydown').value += '\n' + ('keyCode:'+event.keyCode);
}
function Clear(){
document.getElementById('keypress').value = '';
document.getElementById('keydown').value = '';
}
</script>
</head>
<body>
<input type="button" value="Clear" onclick="Clear()" /><br/>
KeyPress - keyCode Result:<br/>
<textarea id="keypress" readonly></textarea><br/>
KeyDown - keyCode Result:<br/>
<textarea id="keydown" readonly></textarea>
</body>
</html>

Ubuntu 14.04 LTS下安裝Google Chrome浏覽器 http://www.linuxidc.com/Linux/2014-04/100645.htm

Ubuntu 13.04 安裝 Chrome 依賴問題解決 http://www.linuxidc.com/Linux/2013-04/83638.htm

openSUSE安裝Chrome浏覽器 http://www.linuxidc.com/Linux/2013-05/84046.htm

Linux用戶安裝 Google Chrome 35 Beta 說明 http://www.linuxidc.com/Linux/2014-05/101099.htm

CentOS 6.x 安裝Google Chrome浏覽器 http://www.linuxidc.com/Linux/2013-01/78066.htm

Chrome 的詳細介紹:請點這裡
Chrome 的下載地址:請點這裡

Copyright © Linux教程網 All Rights Reserved