我们知道键盘事件一般用在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. Lua弱表Weak table

    定义:弱表的使用就是使用弱引用,很多程度上是对内存的控制. 1.weak表示一个表,它拥有metatable,并且metatable定义了__mode字段. 2.弱引用不会导致对象的引用计数变化.换言 ...

  2. UVA-10375 数学

    UVA-10375 题意 : 输入p,q,r,s,求C(p,q)/C(r,s). p,q,r,s<=10000:结果不超过1e8 代码: //显然不能直接计算,考虑每个数都可以由若干个素数乘积得 ...

  3. ACE服务端编程3：ACE跨平台之分配堆内存

    ACE服务端编程系列的第三篇,探究ACE解决不同编译器之间分配堆内存的差异. 在ACE的官方示例中会看到大量的ACE_NEW_RETURN,ACE_NEW这样的宏,这是ACE为了消除不同编译器编译的代 ...

  4. Nginx -- proxy_pass配置

    一.proxy_pass 作用域: location 不影响浏览器地址栏的url 设置被代理server的协议和地址 协议可以为http或https 地址可以为域名或IP 二.配置规则 2.1 测试环 ...

  5. 「Python」python绘制图表

    介绍一种简单而又功能强大的绘制图形或报表的包—pyecharts,一个基于Echarts(基于JS的数据可视化库)的图标类库,除了绘制常见的折线图.柱状图.饼图.箱型图和散点图外,还可以绘制3D柱状图 ...

  6. bootstrap 栅格calss

    container container-fluid row col-xs- col-sm- col-md- col-lg- col-md-offset- col-md-push- col-md-pul ...

  7. Asp.Net MVC +EF CodeFirst+多层程序设计

    1.概述 这是一个基于个人博客的一个项目,虽然博客根本没必要做这么复杂的设计.但是公司有需求,所以先自己弄个项目练练手.项目需要满足下列需求 1.层与层之间需要解耦,在后期上线更新维护时不需要覆盖,只 ...

  8. Mybatis多参数及实体对象传递

    在使用Mybatis的时候,经常会有各种各样的参数传递,不同类型,不同个数的参数. 先上个例子:     public List<LifetouchRelease> findOfficeL ...

  9. CentOS7，安装Tomcat8.5、JDK1.8，并设置开机启动（Linux CentOS Tomcat、JDK+Tomcat、Tomcat开机自启动）

    1.下载JDK1.8.Tomcat8 http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.ht ...

  10. Spring 5.0

    Spring 5.0都有什么新功能? 1.最低要求支持JDK8+, J2EE 7+. 2.移除了一些包.类及方法. 3.核心功能加强:全面应用jdk8并兼容jdk9等. 4.SpringMVC:支持s ...