JS 鼠标、键盘事件对象

鼠标事件对象

    mouseEvent鼠标事件对象

    e.clientX 在可视区的x和y的坐标

    e.pageX 在页面文档的X和Y的坐标

    <script>
        document.addEventListener('click', function (e) {
            console.log(e.clientX);
            console.log(e.clientY);
            console.log("--------------");
            console.log(e.pageX);
            console.log(e.pageY);
        })
    </script>

键盘事件对象

    keyup按键弹起时触发

    keydown键盘按下时触发

    keypress键盘按下触发 但是识别不了功能键

    三个事件执行顺序是keydown,keypress,keyup

    keyup和keyDown事件不区分按下按钮的大小写

    keypress可以区分按下按钮的大小写的

 <script>
         // 当键盘弹起时
         document.onkeyup = function () {
             console.log("弹起");
         }
         // 当键盘按下时
         document.onkeydown = function () {
             console.log("按下down");
         }
         // 当键盘按下时
         document.onkeypress = function () {
             console.log("按下press");
         }
         document.addEventListener('keyup', function (e) {
             // 返回按下按钮的ascll码值
             console.log(e.keyCode);
             // 利用ascll码判断用户按下的什么键
             if (e.keyCode === 65) {
                 alert("按下的是a键")
             } else {
                 alert("按下的不是a键")
             }
         })
     </script>