focus和onfocus区别

小陈努力再努力

已于 2022-06-24 16:33:43 修改

阅读量1.5k

点赞数

文章标签：大数据

于 2022-06-24 16:26:44 首次发布

本文链接：https://blog.csdn.net/a1071626267/article/details/125447959

版权

focus() 是方法,表示是去触发使其获得焦点。

onfocus 是事件属性，表示获得焦点时去执行什么。

同理，如 click 和 onclick 等区别也一样。

案例：当键盘按下ASCII码83（对应键盘s），鼠标光标会定到输入框内。

<body>
    <input type="text">
    <script>
       var search = document.querySelector('input');
       document.addEventListener('keyup', function(e) {  //用keyup表示弹起的时候再定光标
           console.log(e.keyCode);
            if(e.keyCode === 83) {
               search.focus();     //此处使用focus方法
            }
       })
    </script>
</body>

另外，如果监听函数中的监听方法是 'keydown'，那么按下s的时候，鼠标光标在定位到文本框的同时，也会输入s，因为按下了s光标定到输入框和输入s是同时进行的。

如果把监听方法是 'keyup'，表示弹起的时候再定光标，就不会再有这种情况。