2

Assume there is a document with a single input. What I'm trying to do is as simple as this:

$("input").focus().is(":focus");

I would expect the above code to return true. Instead, firebug logs an error:

Syntax error, unrecognized expression: Syntax error, unrecognized expression: focus

What am I missing here? I assumed that the syntax used with is() is identical to $(), or I can't do that?

How would you recommend to check for a focused input if this is unfixable instead?

EDIT:

As of jquery 1.6, the :focus selector is part of jquery core: http://api.jquery.com/focus-selector/
If you need it, just upgrade.

showdev
  • 28,454
  • 37
  • 55
  • 73
Razor
  • 27,418
  • 8
  • 53
  • 76

6 Answers6

5

You can test if it's the active (focused) element bu using document.activeElement like this:

if($("input")[0] == document.activeElement) {
  //first input is focused
}

You can give it a try here. Note though that most of the time your actions are triggered on another element, so if say you clicked a button then it would have focus and now be the active element, so you couldn't check this with a button check, because the element's already changed by the time your event fired, in most cases.

Nick Craver
  • 623,446
  • 136
  • 1,297
  • 1,155
  • +1, this would be the quickest solution even if I'll go with the one Russell linked, so that I can have the `:focus` selector - more jqueryish :) – Razor Sep 06 '10 at 07:31
4

$("input").focus() should suffice. As :focus is not a selector.

  $("input").focus(function () {
         //do something
    });

Edit:

$("input:focus").runFunc(); I suppose that might work. Cletus has summed up this problem well I think, its worth a look.

Community
  • 1
  • 1
Russell Dias
  • 70,980
  • 5
  • 54
  • 71
  • This was just the most concise example I could think of to reproduce the error I'm having: `.is(":focus")` does not work. I'm not trying to `.focus()` an input, I'm trying to check if it's focused instead. – Razor Sep 03 '10 at 12:11
  • Do you plan on triggering an event once its focused? As my second function will be able to do so.. just replace the comment with the event... – Russell Dias Sep 03 '10 at 12:12
  • Also, you say that `:focus` is not a selector. How come that `$(":focus")` **does** correctly select the focused inputs then? – Razor Sep 03 '10 at 12:14
  • According to the selectors list on http://api.jquery.com/category/selectors/ `:focus` is not a selector. – Russell Dias Sep 03 '10 at 12:14
  • Follow the link I have posted above. – Russell Dias Sep 03 '10 at 12:19
2

Add this to your code and it will work:

jQuery.expr[':'].focus = function( elem ) {
  return elem === document.activeElement && ( elem.type || elem.href );
};
Raduly Botond
  • 21
  • 1
1

You can use jQuery .data() function to do something like that.

$('input').focus(function () {
    $(this).data('focus', true); // set focus to true (on focus)
});
$('input').blur(function () {
    $(this).data('focus', false); // set focus to false (on blur)
});

Then to check for the focus use $('#element-id').data('focus'). If this is set to true, the element has the focus.

Viktor Stískala
  • 1,447
  • 1
  • 13
  • 23
0

do something like this instead:

$('input').focus(function(){$(this).addClass('focus')});

you can then check if an element has focus like this:

$('input').hasClass('focus'); // this will return true or false

Moin Zaman
  • 25,281
  • 6
  • 70
  • 74
0

if you want to check wether an input has focus or not you can use:

$('input:focus') //returns the focused element, assuming it's an input element...

$('[selector]:focus').length == 0 //check if a selected element has focus...
mamoo
  • 8,156
  • 2
  • 28
  • 38