I need to determine what caused a focus event.

Ideally, I want to differentiate between a click, a tab/keyboard input, and a manual (via code) trigger.

How can I do this?

I'm looking at the event object, but I'm not seeing anything too useful.

I need to determine what caused a focus event.

Ideally, I want to differentiate between a click, a tab/keyboard input, and a manual (via code) trigger.

How can I do this?

I'm looking at the event object, but I'm not seeing anything too useful.

• javascript
• jquery
• events
• jquery-events

• Try to bind 'mouseover' event (or 'click'), and if it fires set some mouse flag, then check it in focus event – spacevillain Commented Jul 17, 2011 at 21:52
• @spacevillain: can't click also be triggered by code? – PeeHaa Commented Jul 17, 2011 at 21:56
• What about 'mouseover' followed by 'click'? You can check if mouse coordinates are in right bounds. Ugly, but I think it should work. What do you need this for? :-) – spacevillain Commented Jul 17, 2011 at 22:02
• @spacevillain: an autoplete feature. I want it to pop open whenever you click the element, or tab into the element and the element is blank, or if it was triggered via code, do nothing. – mpen Commented Jul 17, 2011 at 22:12
• Not a duplicate but similar: stackoverflow./questions/6674669/… – mu is too short Commented Jul 17, 2011 at 22:16

1 Answer 1

If the focus es from a $x.focus() call, then the event won't have an originalEvent property because there was no event from the browser so:

if(ev.hasOwnProperty('originalEvent')) {
    // Focus event was manually triggered.
}

To differentiate between keyboard and mouse based focus events, you could try binding a keydown handler to everything else to detect a Tab or Shift-Tab but that would be a gross hack and probably not reliable; for example, on an iPad, you don't hit Tab to move to the next field, you hit Next or Previous in the popup keyboard to move around and those may not register as key presses at all.

There's a similar question about click events that might be of interest as well:

In jQuery, how can I tell between a programmatic and user click?

As you note in the ments, you could trap click events to detect a mouse-based focus change and set a flag somewhere to remember it. Then you'd have this:

1. If there is no originalEvent in the jQuery event then the focus change was triggered manually (i.e. $x.focus() or similar).
2. If the click handler flag is set then the focus change came from a mouse action.
3. Otherwise the focus change came from a keyboard event.

You'd have to be careful that your click and focus events came in the right order and you'd need to make sure the flag was cleared when you're done with it. This might not be bullet proof but maybe it doesn't need to be.