1.键盘事件
onkeyup 某个键盘按键被松开时触发
onkeydown 某个键盘按键被按下时触发
onkeypress 某个键盘按键被按下时 触发但是它不识别功能键 比如 ctrl shift 箭头等
案例:
<script>
// 常用的键盘事件
//1. keyup 按键弹起的时候触发
document.addEventListener('keyup', function() {
console.log('我弹起了');
})
//2. keydown 按键按下的时候触发 能识别功能键 比如 ctrl shift 左右箭头
document.addEventListener('keydown', function() {
console.log('我按下了down');
})
//3. keypress 按键按下的时候触发 不能识别功能键 比如 ctrl shift 左右箭头啊
document.addEventListener('keypress', function() {
console.log('我按下了press');
})
// 4. 三个事件的执行顺序 keydown -- keypress -- keyup
</script>
2.键盘事件对象
键盘事件对象属性:keyCode
说明: 返回改建的ASCII值(美国信息交换标准代码)
注意:
keydown 和keyup 不区字母大小写, keypress区分大小写
在实际开发种,更多的使用 keydown 和keyup , 它能识别所有的键(包括功能键)
keypress 不能识别功能键,但是keyCode属性能区分大小写,返回不同的ASCII值。
使用keyCode属性判断用户按下哪个键
e 就是事件对象 (event 或者 evt)
<script>
document.addEventListener('keyup', function(e) {
console.log('up:' + e.keyCode);
if (e.keyCode === 65) {
alert('您按下的a键');
}
})
document.addEventListener('keypress', function(e) {
// console.log(e);
console.log('press:' + e.keyCode);
})
</script>