How to detect `focusin` support?
This uses the fact that calling focus()
triggers focusin
: http://jsfiddle.net/pimvdb/YXeD3/.
The element must be visible and inserted into the DOM, otherwise focusin
is not fired for some reason.
var result = (function() {
var hasIt = false;
function swap() {
hasIt = true; // when fired, set hasIt to true
}
var a = document.createElement('a'); // create test element
a.href = "#"; // to make it focusable
a.addEventListener('focusin', swap, false); // bind focusin
document.body.appendChild(a); // append
a.focus(); // focus
document.body.removeChild(a); // remove again
return hasIt; // should be true if focusin is fired
})();
focusin & focusout should be fired BEFORE target element receives focus, event order is also seems buggy
http://www.w3.org/TR/DOM-Level-3-Events/#events-focusevent-event-order
currently, only IE works according to spec:
Chrome/Safari:
focus
focusin
DOMFocusIn
blur
focusout
DOMFocusOut
focus
focusin
DOMFocusIn
Opera 12:
focus
DOMFocusIn
focusin
blur
DOMFocusOut
focusout
focus
DOMFocusIn
focusin
IE 8:
focusin
focus
focusout
focusin
blur
focus
Firefox 14:
focus
blur
focus