定义和使用
charCode 属性返回onkeypress事件触发键值的字母代码。
Unicode 字符代码是一个字母的数字 (如数字 “97” 代表字母 “a”)。
提示: 如果你需要将 Unicode 值转换为字符,可以使用 fromCharCode() 方法。
注意: 如果该属性用于 onkeydown 或 onkeyup 事件,返回值总为 “0”。
注意: 该属性是只读的。
注意: which 和 keyCode 属性提供了解决浏览器的兼容性的方法,最新版本的 DOM 事件推荐使用 key 属性来替代该方法。
注意:IE8 及其更早版本不支持 which 属性。不支持的浏览器可使用 keyCode 属性。但是, keyCode 属性在 Firefox 浏览器的 onkeypress 事件中是无效的。 兼容这些浏览器你可以使用以下代码:var x = event.charCode || event.keyCode; // 使用 charCode 或 keyCode, 这样可支持不同浏览器
提示: 你同样可以使用 keyCode 属性来检测特殊的按键 (如 “caps lock” 或 箭头按键)。 keyCode 和 charCode 属性提供了解决浏览器的兼容性的方法,最新版本的 DOM 事件推荐使用 key 属性来替代该方法。
提示: 如果你想查看是否按下了 “ALT”, “CTRL”, “META” 或 “SHIFT” 键,可使用 altKey, ctrlKey, metaKey 或 shiftKey 属性。
浏览器支持
表格中的数字表示支持该属性的第一个浏览器的版本号。
属性 | 谷歌 | IE | 火狐 | 苹果 | opera |
---|---|---|---|---|---|
charCode | Yes | 9.0 | Yes | Yes | Yes |
语法
event.charCode
技术细节
返回值: | 数字,表示 Unicode 字符代码 |
---|---|
DOM 版本: | DOM Level 2 Events |
实例
DEMO1:获取按键 Unicode 值的浏览器兼容解决办法。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Web176.com教程(web176.com)</title> </head> <body> <p>在输入框中输入键盘上的字符获取按下字母的 Unicode 字符代码和 Unicode 键代码 。</p> <input type="text" size="40" onkeypress="myFunction(event)"> <p id="demo"></p> <script> function myFunction(event) { // 如果浏览器不支持 charCode 使用 event.keyCode ( IE8 及更早版本) var x = event.charCode || event.keyCode; document.getElementById("demo").innerHTML = " Unicode 值为:" + x; } </script> </body> </html>
DEMO2:当用户按下 “O” 键时,弹出提示信息。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Web176.com教程(web176.com)</title> </head> <body> <p>在输入框中按下 "O" 键,会弹出提示信息。</p> <input type="text" size="40" onkeypress="myFunction(event)"> <p id="demo"></p> <script> function myFunction(event) { var x = event.charCode || event.keyCode; if (x == 111 || x == 79) { // o 是 111, O 是 79 alert("你按下的是 'O' 键!"); } } </script> </body> </html>
DEMO3:将 Unicode 值转换为字符。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Web176.com教程(web176.com)</title> </head> <body> <p>在输入框中输入键盘上的字符获取按下字母的 Unicode 字符代码和 Unicode 键代码 。</p> <input type="text" size="40" onkeypress="myFunction(event)"> <p id="demo"></p> <script> function myFunction(event) { var x = event.charCode || event.keyCode; // 获取 Unicode 值 var y = String.fromCharCode(x); // 将值转换为字符 document.getElementById("demo").innerHTML = "数字: " + x + " = 字符: " + y; } </script> </body> </html>
作者:terry,如若转载,请注明出处:https://www.web176.com/javascriptbook/domtips/4239.html