在DIV元素上捕获按键按下(或按键按下)事件

2020/11/13 03:22 · javascript ·  · 0评论

如何捕获DIV元素上的按键或按下事件(使用jQuery)?

需要什么来赋予DIV元素焦点?

(1)设置tabindex属性:

<div id="mydiv" tabindex="0" />

(2)绑定到按键:

 $('#mydiv').on('keydown', function(event) {
    //console.log(event.keyCode);
    switch(event.keyCode){
       //....your actions for the keys .....
    }
 });

要把重点放在开始上:

$(function() {
   $('#mydiv').focus();
});

要删除(如果您不喜欢)div焦点边框,请outline: none在CSS中进行设置

有关更多可能性,请参见键码keyCode

假设您使用jQuery的所有代码。


tabindex HTML属性指示其元素是否可以聚焦,以及是否/在何处参与顺序键盘导航(通常使用Tab键)。阅读MDN Web文档以获取完整参考。

使用jQuery

使用JavaScript

这是纯JS上的示例:

document.querySelector('#myDiv').addEventListener('keyup', function (e) {
  console.log(e.key)
})
#myDiv {
  outline: none;
}
<div 
  id="myDiv"
  tabindex="0"
>
  Press me and start typing
</div>
本文地址:http://javascript.askforanswer.com/zaidivyuansushangbuhuoanjiananxiahuoanjiananxiashijian.html
文章标签: ,   ,   ,   ,  
版权声明:本文为原创文章,版权归 javascript 所有,欢迎分享本文,转载请保留出处!

文件下载

老薛主机终身7折优惠码boke112

上一篇:
下一篇:

评论已关闭!