Question

How can I, in a standard way, detect when focus leaves an element or any of its child elements.

blur won’t do since it’s fired when the focus goes into a child element.

IE provides the incredibly useful event focusout for this (it’s like blur, but bubbles), but How can I do it in a standard way, except for attaching a blur handler to all the child elements?

Edit: apparently I was not clear about what I meant.

I have a structure like this:

<div id="parent">
    <input type="text" id="child1">
    <div id="child2" tabindex="0">yada</div>
</div>
<input type="text" id="outside"/>

I want to attach an event handler to parent to find out when focus leaves any of its child elements (child1 and child2) to go to an element outside of parent, e.g. the one with id “outside”. In IE I can do this by binding to the focusout event, but that event does not exist in Firefox (or in the W3C DOM).

Answer 1

I ended up creating the jQuery focus plugin to solve this issue, in case anyone runs into the same problem.