我们知道键盘事件一般用在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. Codeforces Round #409 (rated, Div. 2, based on VK Cup 2017 Round 2) A B C D 暴力 水 二分 几何

    A. Vicious Keyboard time limit per test 2 seconds memory limit per test 256 megabytes input standard ...

  2. 1.UiDevice API 详细介绍

    1.UiDevice按键与keycode使用 返回值 方法名 说明 boolean pressBack() 模拟短按返回back键 boolean pressDPadCenter() 模拟按轨迹球中点 ...

  3. Qt ------ QString 操作

    QStringList QString::arg     ------- 字符串的格式化处理,类始于sprintf 比如:QString("%1").arg(10,2,16,QLa ...

  4. 这年头不会点Git真不行！！！

    版本控制 说到版本控制,脑海里总会浮现大学毕业是写毕业论文的场景,你电脑上的毕业论文一定出现过这番景象! 1 2 3 4 5 6 7 8 9 10 11 毕业论文_初稿.doc 毕业论文_修改1.do ...

  5. 关于HttpURLConnection/HttpsURLConnection请求出现了io.filenotfoundexception:url的解决方法

    //从输入流读取返回内容InputStream is = null;int status = connection.getResponseCode();if(status>= HttpStatu ...

  6. [吴恩达机器学习笔记]14降维3-4PCA算法原理

    14.降维 觉得有用的话,欢迎一起讨论相互学习~Follow Me 14.3主成分分析原理Proncipal Component Analysis Problem Formulation 主成分分析( ...

  7. 深入探索C++对象模型(七)

    站在对象模型的尖端(On the Cusp of the Object Model) Template 下面是有关template的三个主要讨论方向: template的声明,基本上来说就是当你声明一 ...

  8. HDU 2827 高斯消元

    模板的高斯消元.... /** @Date : 2017-09-26 18:05:03 * @FileName: HDU 2827 高斯消元.cpp * @Platform: Windows * @A ...

  9. mysql 修改密码的几种方式

    第一种方式: 最简单的方法就是借助第三方工具Navicat for MySQL来修改,方法如下: 1.登录mysql到指定库,如:登录到test库. 2.然后点击上方“用户”按钮. 3.选择要更改的用 ...

  10. mysql 使用shell时出现 ERROR 2006 (HY000): MySQL server has gone away 解决方法

    ERROR (HY000): MySQL server has gone away No connection. Trying to reconnect... Connection Current d ...