JS事件之事件类型[焦点事件]
来源:互联网 发布:连汝安 知乎 编辑:程序博客网 时间:2024/04/27 21:33
焦点事件会在页面获得或失去焦点时触发。利用这些事件并与document.hasFocus()方法及document.activeElement属性配合,可以知晓用户在页面上的行踪,有以下6信焦点事件:
- blur:在元素失去焦点时触发。这个事件不会冒泡;所有浏览器都支持它;
- DOMFocusIn:在元素获得焦点时触发。这个事件与HTML事件focus等价,但它冒泡,只有Opera支持这个事件;DOM3级事件废弃了DOMFocusIn,选择了focusin;
- DOMFocusOut:在元素失去焦点时触发。这个事件是HTML事件blur的通用版本,只有Opera支持这个事件;DOM3级事件废弃了DOMFocusOut,选择了focusout;
- focus:在元素获得焦点时触发。这个事件不会冒泡,所有浏览器都支持它;
- focusin:在元素获得焦点时触发。 这个事件与HTML事件focus等价,但它冒泡,支持这个事件的浏览器有IE5+ safari5.1+ Opera11.5+ 和 Chrome;
- focusout: 在元素获得失去时触发。 这个事件是HTML事件blur的通用版本,,支持这个事件的浏览器有IE5+ safari5.1+ Opera11.5+ 和 Chrome;
这一类事件中最主要的两个foucs和blur,它们都是JavasScript早期就得到所有浏览器支持的事件。这些事件的最大问题是它们不冒泡。因此,IE的focusin和focusout与Opera的DOMFocusIn和DOMFocusOut才会发生重叠。IE的方式最后被DOM3级事件采纳为标准 方式。
当焦点从页面中的一个元素移动到另一个元素,会依次触发下列事件:
- focusout 在失去焦点的元素上触发;
- focusin 在获得焦点的元素上触发;
- blur 在失去焦点的元素上触发;
- DOMFocusOut 在焦点的元素上触发 ;
- focus 在获得焦点的元素上触发;
- DOMFoucsIn 在获得焦点的元素上触发;
其中,blur DOMFoucsOut和focusout的事件目标是失去焦点的元素;而focus DOMFocusIn和focusin的事件 目标是获得焦点的元素;
在确定浏览器是否支持这些事件,可以使用如下代码:
var isSupported = document.implementation.hasFeature('FocusEvent', '3.0');
即使focus和blur不冒泡,也可以在捕获阶段侦听到它们
阅读全文
0 0
- JS事件之事件类型[焦点事件]
- 事件类型--焦点事件
- JS事件之事件类型[UI事件]
- JS之失去焦点事件
- JS失去焦点事件
- js 文本框焦点事件
- js焦点事件
- JS 焦点事件
- JS事件之事件类型[鼠标和滚轮事件]
- JS的事件(1)--焦点事件/event事件/事件流
- 第十三章:事件类型(简述、UI事件、焦点事件)
- js中的焦点事件问题
- js—BOM焦点事件
- 焦点事件
- 焦点事件
- 焦点事件
- 焦点事件
- 焦点事件
- 2017.6.27DI/DO测试总结
- 【JZOJ5167】下蛋爷
- Spring cloud
- Scala练习-直接插入排序
- c语言中全局变量重定义
- JS事件之事件类型[焦点事件]
- Git 从入门到精通(忽略某些文件.gitignore)(五)
- ORACLE 行转列谓词推入
- eclipse项目导入AS方法
- 各种链表队列的宏操作及应用
- 两条Linux删数据跑路命令
- dedecms修改文章标题限制长度
- android 监听网络状态
- 怎样调试静态lib