前天改一个bug, js 实现的一个 面板拖拉,左右各两个列表,中间面板画线连接,页面左侧列表选中后,key 事件无效。右侧选中确有效,很奇怪,查看源码,左侧选中后,$(document).on("keydown",function(event){}    对左侧无效,由于无异常抛出,只能一点点代码。一个字,累。

确定页面部分div失去焦点,索性,给外面最大div  添加一个 获取焦点事件,解决 。

$("#myspan").attr("tabindex",0);

$("#myspan").focus();

The keydown event is sent to an element when the user first presses a key on the keyboard. It can be attached to any element, but the event is only sent to the element that has the focus. Focusable elements can vary between browsers, but form elements can always get focus so are reasonable candidates for this event type.
以上是从jquery文档中copy下的一段文本,它说明我们可以给form元素绑定keydown事件,因为它们可以获取焦点,但怎样去给div、span绑定呢?
答案就是tabindex这个属性
js中改变这个属性:jsObj.tabIndex
jquery : $(selector).attr("tabindex",value)

tabindex

元素的tabindex属性用来定义元素是否可以获取焦点,是否可以通过连续的焦点导航(一般情况是按tab键)获取焦点,与你获取焦点的顺序。
其值必须是整数值。
如果没有设置,或者设置的值不正确,则按照惯例执行。
如果是负数,用户不可以通过连续的焦点导航获取焦点,但可以用其他方式获取焦点。
如果是零,则可以通过连续的焦点导航获取焦点,按照惯例确定顺序。
如果是正数,则可以通过连续的焦点导航获取焦点,按照该值确定顺序。

div默认是得不到焦点的,可以为其设置tabindex属性使其可以获得焦点。也就可以绑定键盘事件。

事例 :

<span id="myspan"></span>

js:

$("#myspan").attr("tabindex",0);

$("#myspan").focus();

此文章来自网络转载

<span> <div> 局部 keydown ,keyup事件。页面部分div $(document) 无效,可能焦点,添加焦点。的更多相关文章

  1. 在JS/jQuery中,怎么触发input的keypress/keydown/keyup事件?

    怎么触发keypress/keydown/keyup事件? 问题: 1.在之前的写的input后面添加了搜索按钮 2.input只有keyup事件,如下: $("#desktop_folde ...

  2. DataGridView在Cell编辑状态响应回车键下的KeyPress/KeyDown/KeyUp事件

    我们知道由于DataGridView的单元格DataGridCell处于编辑的时候,当你按Enter键,那么DataGridView是不会激发KewPress/KeyDown/KeyUp这些事件的,因 ...

  3. angular js 的 ng-keyup 监听 keydown keyup事件获取 keyCode

    参考这个页面.http://www.angularjshub.com/examples/eventhandlers/keyboardevents/ Html页面代码: <input ng-mod ...

  4. Vue2键盘事件:keydown/keyup...

    Vue2键盘事件:keydown/keyup... 1.使用 <!DOCTYPE html> <html> <head> <title></tit ...

  5. keyDown keyPress keyUp 事件的区别

    keyDown keyPress keyUp  事件的区别 一 触发顺序 显而易见,事件发生的顺序是: keydown --> keypress --> keyup 当按住一个键一段时间后 ...

  6. Winform下KeyDown,KeyPress,KeyUp事件的总结(转)

    原文: http://www.cnblogs.com/xiashengwang/archive/2011/09/15/2578798.html 在winform程序中,经常会用到这几个事件用于控制数字 ...

  7. C#控件中的KeyDown、KeyPress 与 KeyUp事件浅谈

    研究了一下KeyDown,KeyPress 和 KeyUp 的学问.让我们带着如下问题来说明: 1.这三个事件的顺序是怎么样的? 2.KeyDown 触发后,KeyUp是不是一定触发? 3.三个事件的 ...

  8. keydown、input 和 keyup 事件

    keydown.keyup 属于键盘事件,input 属于文本事件. keydown:当用户按下键盘上的任意按键时触发,如果按住不放,会重复触发此事件. keyup:当用户释放键盘上的按键时触发. i ...

  9. keyup事件、keydown事件和input事件的区别

    keydown.keyup 属于键盘事件,input 属于文本事件 详细说明: keydown:当用户按下键盘上的任意按键时触发,如果按住不放,会重复触发此事件. keyup:当用户释放键盘上的按键时 ...

随机推荐

  1. 如何同时启动多个Tomcat服务器

    1.使用压缩版的tomcat不能使用安装版的. 2.第一个tomcat的配置不变. 3.增加环境变量CATALINA_HOME2,值为新的tomcat的地址:增加环境变量CATALINA_BASE2, ...

  2. C# 中控件 WebBrowser 对 frameset/ iframe 操作和内容获取

    1.获取frame的document HtmlDocument htmlDoc = webBrowser1.Document;  htmlDoc = webBrowser1.Document.Wind ...

  3. 第一篇、jQuery的使用

    1.jquery 的优势 >轻量级 >强大的选择器 >出色的DOM操作封装 >完善的事件和事件对象的兼容机制 >完善的ajax >不污染全局变量($可以随时交出控制 ...

  4. Git的安装以及一些操作

    1.安装Git-2.5.1-64-bit.exe  一直下一步直至完成 2.注册github账号 官网地址:https://github.com/github 3.找到一个按钮“New Reposit ...

  5. spring事务到底用于service层还是dao层

    Spring事务为业务逻辑进行事务管理,保证业务逻辑上数据的原子性. 事务得根据项目性质来细分:事务可以设置到三个层面(dao层.service层和web层). 第一:web层事务,这一般是针对那些安 ...

  6. C++ 的隱式型別轉換

    先上一段代碼, 這段代碼竟然可以編譯過,我的老天! class Boo { Boo(int c){ cout << "I'm Boo"; } }; void do_so ...

  7. 重学C++ (1)

    写在开头的话:这学期没有写太多的代码,终于把中英文两篇论文弄完了,趁着中间的空隙,想想找工作的处境.自己也定了自己的方向.不管学什么语言吧,每个语言都有自己的优势和使用的群体.只要自己是良马,终会有伯 ...

  8. 何谓IOC的核心思想

    IOC(Inversion of Control)即控制反转,是在面试或平常交流中经常遇到了词汇:我也曾经仿照Spring,利用JDK的反射和动态代理实现了一个简单的IOC框架,感觉算是知其然也知其所 ...

  9. hadoop2-shell操作详解

  10. [CSS]浮动的那点事儿

    元素是怎样浮动 元素的水平方向浮动,意味着元素只能左右移动而不能上下移动. 一个浮动元素会尽量向左或向右移动,直到它的外边缘碰到包含框或另一个浮动框的边框为止. 浮动元素之后的元素将围绕它. 浮动元素 ...