Focus Event

Focus 事件是当页面中的元素获得或失去焦点时触发,相关事件通常与document.hasFocus()方法和document.activeElement协同使用,来洞察用户是如何浏览网页的。

  下面是六个focus event:

  blur:当一个元素失去焦点时发生的事件,这个事件不冒泡并且所有的浏览器都支持这个事件。

  DomFocusIn:当一个元素获得焦点是触发这个事件,这是一个冒泡般的HTML事件,在主流浏览器中Opera是唯一支持这个事件的浏览器,而且在Dom 3级事件中废除了DomFocusIn,采用focusin。

  DomFocusOut:不解释。

  focus:当页面中的一个元素获得焦点的时候触发该事件,这个事件不冒泡,并且被所有浏览器支持。

  focusin:功能与DomFocusIn相同,是冒泡版的HTML事件,IE5.5+、Safari5.1+、Opera11.5+、和chrome支持这个事件。

  focusout:与focusin相对应的功能。

  在这六个事件中最常用的就是blur和focus事件,他们被所有浏览器支持,这两个事件最大的话题就是他们不支持冒泡,所以IE引入focusin和focusout,opera引入DomFocusIn和DomFocusOut,在DOM3级事件中IE的方法最后被采纳为标准。

  当焦点从页面的一个元素移动到另一个元素时,会触发如下事件,

  1. focusout  2. focusin 3. blur  4. DOMFocusOut   5. focus   6. DOMFocusIn   

  blur、DomFocusOut、focusout事件的target是失去焦点的元素,而focus、DomFocusIn、focusin的target是得到焦点的元素

  虽然blur 和 focus 不支持事件的冒泡,但是在事件的捕获阶段是可以侦听的,

  相关文章参见

  http://www.quirksmode.org/blog/archives/2008/04/delegating_the.html

本博客从今日起停止更新,后续的文章将会发布在新的博客mrbackkom.github.io
原文地址:https://www.cnblogs.com/MrBackKom/p/2560886.html