常用的键盘事件

键盘事件

键盘事件

事件案例：

    <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>

键盘事件对象

键盘事件对象属性：keyCode
说明： 返回改建的ASCII值（美国信息交换标准代码）

注意：

• keydown 和keyup 不区字母大小写， keypress区分大小写
• 在实际开发种，更多的使用 keydown 和keyup ， 它能识别所有的键（包括功能键）
• keypress 不能识别功能键，但是keyCode属性能区分大小写，返回不同的ASCII值。

使用keyCode属性判断用户按下哪个键
e 就是事件对象 就是（event 或者 evt）

 <script>
        // 键盘事件对象中的keyCode属性可以得到相应键的ASCII码值
        document.addEventListener('keyup', function(e) {
            console.log('up:' + e.keyCode);
            // 我们可以利用keycode返回的ASCII码值来判断用户按下了那个键
            if (e.keyCode === 65) {
                alert('您按下的a键');
            } else {
                alert('您没有按下a键')
            }
        })
        document.addEventListener('keypress', function(e) {
            // console.log(e);
            console.log('press:' + e.keyCode);
        })
    </script>