How to tell if nothing is focused?

Question

I was wondering how I can write a condition for an if-statement in js / jQuery that is when nothing is focused on.

I guess one way one could approach this is everything is blurred ?

I need some help turning this into an if statement where I can put code inside as the suite and then have it executed only if nothing is being focused on currently.

Bind to the blur event and the focus event. In the blur event, set a timeout, and clear that timeout in the focus event. If the timeout finishes (10ms or so), then nothing is currently focused. — Kevin B, Mar 06 '13 at 19:46
something is always focused, even if it is just the window. Only time "everything" is blurred is when you click out of the browser window or change tabs. — Chad, Mar 06 '13 at 19:47
I was wondering what was your actual requirement, there might be a better solution. — ssilas777, Mar 06 '13 at 19:47
http://stackoverflow.com/questions/11277989/how-to-get-the-focused-element-with-jquery . . . if that is empty, then nothing is focused. But, I can't imagine that that should ever be the case. Note the "$(document.activeElement)" answer. — talemyn, Mar 06 '13 at 19:49
@RobinvanBaalen I don't have anything right now. I don't know where to start, apologies. — IMUXIxD, Mar 06 '13 at 20:36
@ssilas777 what I am actually wondering is when the document / page is focused and nothing within it is focused. — IMUXIxD, Mar 06 '13 at 20:37

Michael Zaporozhets · Accepted Answer · 2013-03-06T20:00:19.313

3

$('*:focus').length will return the number of elements that are focused on a page.

jsFiddle

To use this in an if statement you can simply check if there is no matching elements and then run whatever code you want.

if ($('*:focus').length == 0) {
     //do Something
}

Reference:

.length

edited Mar 06 '13 at 20:00

answered Mar 06 '13 at 19:55

Michael Zaporozhets

23,588
3
30
47

`.size()` is deprecated, you should use `.length` instead. – JJJ Mar 06 '13 at 19:58
@Juhana indeed, answer updated. – Michael Zaporozhets Mar 06 '13 at 20:01
Why bind to everything? Why not bind to `document` and let the DOM bubbling make it all come to you? – Chad Mar 06 '13 at 20:16
@Chad that sounds like a better idea than binding it to everything. How could I fix it because if I replace the * with document, it is in quotes and doesn't refer to the document, but to a , which doesn't exist unless made. – IMUXIxD Mar 06 '13 at 20:43
`$(document)`, which creates a jQuery wrapper around the document object. – Chad Mar 06 '13 at 21:26
@Chad I know that part, but how do I add the :focus).length part to the $(document) part? Would it be $(document:focus).length? Apologies if that sounded rude, I didn't mean for it to be. – IMUXIxD Mar 07 '13 at 02:13
1

@IMUXIxD You misunderstand, never mind; just use this solution for the unfocused count. – Chad Mar 07 '13 at 12:47
This does not work for textareas. If i focus a textarea it will say evaluate to true – Gábor Erdős Sep 01 '20 at 19:07

score 0 · Answer 2 · answered Mar 06 '13 at 19:56

you can try this

it is not a complete solution but without the code you are using posted it is as far as ill go. You can probably figure it out from here.

<div id="content">
<input tabIndex="1">
<input tabIndex="2">
<select tabIndex="3">
<option>select menu</option>
</select>
<div tabIndex="4">
a div
</div>

this tests for no inputs focused using the ! operator

$(document).ready(function(){
if (!$(':input').is(':focus')){
alert('no focus');
}
});

http://jsfiddle.net/Jvev2/

How to tell if nothing is focused?

2 Answers2