Testing :focus on multiple elements with is(), has(), filter(), ...

[mett.work@…]

Demo: I select multiple elements with .text-block selector. I want to check if ANY element has the focus (one of them has when executing this code), here are the results :

$('.text-block').is(":focus") // returns false
$('.text-block').has(":focus") // returns empty object array
$('.text-block').filter(":focus") // returns empty object array on FF,returns the focused element on chrome
$('.text-block:focus') // returns the focused element

You can see that only $('.text-block:focus') works for both FF and chrome. The problem is that when you have the elements as a variable, $textBlocks, you can't use the version that works anymore.

[mett.work@…]

Here is the jsfiddle test case:

​http://jsfiddle.net/kMD6U/

Try to focus on one of the divs, and you'll notice that on FF and Chrome, the result is different for filter() for example.

[anonymous]

and forgot to mention that result for .is(":focus") is also different in the two browsers

[dmethvin]

Duplicate of #13041.
Some of this is misunderstanding of the APIs, and the rest is a Firefox inconsistency (not sure if it can be called a bug).

$('.text-block').is(":focus") returns false

That will only check the first element, per .is().

$('.text-block').has(":focus") returns empty object array

That is incorrect use of .has(), which checks whether any descendant elements match the selector.

$('.text-block').filter(":focus") returns empty object array on FF,returns the focused element on chrome

That is duplicate of #13041.