我们知道键盘事件一般用在input这些可以获取焦点的元素上，但是作为div，尽管官方上说可以绑定键盘事件，但是我写了以后发现不生效，于是找答案。

果然，找到了一个神器：tabindex

它是html5标签的一个属性，默认它的值是-1也就是不可以，在div上，我们要设置这个值不超过999就可以了。

document.querySelector('div').setAttribute("tabindex", 1)&&document.querySelector('div').addEventListener("keyup", functionName);

html5标签div可绑定键盘事件方法的更多相关文章

  1. html5自动弹出软键盘的方法

    html5自动弹出软键盘的方法<pre> <textarea placeholder="说点什么......" autofocus="autofocus ...

  2. vue 移动端在div上绑定click事件 失效

    在.vue的文件中使用了better-scroll,在div标签上绑定click事件后,无效. 原因:使用了better-scroll,默认它会阻止touch事件.所以在配置中需要加上click: t ...

  3. 为select的option绑定键盘事件

    1. 目的 可以使用快捷键1.2.3.4等自动选中select框对应的option 2. 代码 <select id="selectItem" class="for ...

  4. 前端（十五）—— JavaScript事件：绑定事件方式、事件的冒泡和默认事件、鼠标事件、键盘事件、表单 事件、文档事件、图片事件、页面事件

    JS事件:绑定事件方式.事件的冒泡和默认事件.鼠标事件.键盘事件.表单 事件.文档事件.图片事件.页面事件 一.事件的两种绑定方式 1.on事件绑定方式 document.onclick = func ...

  5. HTML5 Canvas鼠标与键盘事件

    演示HTML5 Canvas鼠标事件,获取Canvas对象上的鼠标坐标,演示键盘事件 通过键盘控制Canvas上对象移动. Canvas对象支持所有的JavaScript的鼠标事件,包括鼠标点击(Mo ...

  6. juery给所有ID属性相同的div绑定一个事件

    案例: <div id="div1">内容</div> <div id="div1">内容</div> < ...

  7. js 绑定的键盘事件

    在全局绑定键盘事件 document.onkeydown = function(event){        //在全局中绑定按下事件 var e  = event  ||  window.e; va ...

  8. javascript 键盘事件总结

    原文:http://www.cnblogs.com/rubylouvre/archive/2009/08/20/1550526.html#2583814 在进入正题前,我们看一下浏览器对于键盘的一些默 ...

  9. vue添加页面键盘事件

    我司开发项目,用的是vue+elementUI,做登陆页面的时候,点击enter键的时候要实现和点击登陆按钮一样的功能,所以就百度了一下,于是一通百度之后,就在点击按钮上面直接添加了@keyup.en ...

随机推荐

  1. STL源码分析归档

    1) algorithm 2) traits 3) iterator 4) list 5) function 6) rbtree 7) bitset 8) priority_queue 9) hash ...

  2. 题解 P3153 【[CQOI2009]跳舞】

    P3153 [CQOI2009]跳舞 题目描述 一次舞会有n个男孩和n个女孩.每首曲子开始时,所有男孩和女孩恰好配成n对跳交谊舞.每个男孩都不会和同一个女孩跳两首(或更多)舞曲.有一些男孩女孩相互喜欢 ...

  3. Tensorboard教程：监控指标可视化

    Tensorflow监控指标可视化 觉得有用的话,欢迎一起讨论相互学习~Follow Me 参考文献 强烈推荐Tensorflow实战Google深度学习框架 实验平台: Tensorflow1.4. ...

  4. DES解码

    DES加解密算法是一个挺老的算法了,现在给出它的C语言版. des.h #ifdef __cplusplus extern "C" { #endif ]); char* des(c ...

  5. vue-router的新奇写法

    加班中........................... 我们以前写路由是下面这样的 这导致了页面一多,我们的路由文件内容就比较多,不好看. 下面我为大家介绍一下,新的一种写法 这种写法,我们只需 ...

  6. 关于 Capella 需要纠正的语音

    li { font-size: 18px; } 关于 Capella 需要纠正的语音 持续更新 浊塞音声带要振动 区分 [θ]/[ð] 和 [t̪],注意舌位 [ɫ] 的舌位,切记不能圆唇 [æ] 的 ...

  7. 谈谈对Spring IOC（控制反转）的理解--转

    谈谈对Spring IOC(控制反转)的理解--转   学习过Spring框架的人一定都会听过Spring的IoC(控制反转) .DI(依赖注入)这两个概念,对于初学Spring的人来说,总觉得IoC ...

  8. AngularJs几种服务区别

    下面说说这几种函数之间的区别: 函数 定义 适合场景 provider(name, Object OR constructor() ) 一个可配置的.有复杂逻辑的服务.如果你传递了一个对象,那么它应该 ...

  9. python3之json模块使用

    1. json模块介绍 json是python自带的操作json的模块. python序列化为json时的数据类型转换关系: python格式 json格式 dict(复合类型) object lis ...

  10. docker 镜像导入和导出

    使用 docker commit 即可把这个容器变为一个镜像 docker commit 8d93082a9ce1 ubuntu:myubuntu 这时候 docker 容器会被创建为一个新的 Ubu ...