Quick question - is it possible to detect whether a focus has e from a mouse click or a tab from a focus event?

I guess if there isn't, I'll have to use a click handle on the same element to determine the source, but I'd prefer a way from the focus event.

Thanks

Gausie

Quick question - is it possible to detect whether a focus has e from a mouse click or a tab from a focus event?

I guess if there isn't, I'll have to use a click handle on the same element to determine the source, but I'd prefer a way from the focus event.

Thanks

Gausie

• javascript
• jquery

• +1 because it's an interesting question. but i fail to see why you need that distinction. – just somebody Commented Dec 11, 2009 at 14:38
• 1 I'm making a data entry form for speedy entry. If the user tabs into the box, I want to scroll so that the element is vertically centered in the screen. But if they click, the effect bees very disorienting, and I don't want it to occur. – Gausie Commented Dec 11, 2009 at 14:43

5 Answers 5

May not work 100% but if there isn't a direct way then can't you just use Mouseover and detect it? The person will have bring the mouse over the control to select it (?)

I'm quite confident that a focus event does not trac the way the focus has been ordered (window.focus, key, click...).

But in the case of a click, you can detect the mouse click. You can also detect keyboard event (more on that http://www.quirksmode/js/keys.html).

What about using mouse position?

In the event handler, pare the current mouse position with the area of your control. If the coordinates fall within the area of the control don't scroll.

This is not a perfect solution of course, since they could hover the element, and then tab to it without clicking. But since you are attempting to reduce any disorientation, this might actually be good side effect.

When working with mouse position, I like to use the script from quirksmode. I think Jquery may provide some functionality for it too.

Try getting the keyCode - here's a link to an article that goes into detail on how. The ments at the bottom may be useful as well.

http://www.geekpedia./tutorial138_Get-key-press-event-using-JavaScript.html

Here's the code from the article. It doesn't show it, but the keyCode for tab is 9.

<script type="text/javascript">

document.onkeyup = KeyCheck;       

function KeyCheck(e)

{

   var KeyID = (window.event) ? event.keyCode : e.keyCode;


   switch(KeyID)

   {

      case 16:

      document.Form1.KeyName.value = "Shift";

      break; 

      case 17:

      document.Form1.KeyName.value = "Ctrl";

      break;

      case 18:

      document.Form1.KeyName.value = "Alt";

      break;

      case 19:

      document.Form1.KeyName.value = "Pause";

      break;

      case 37:

      document.Form1.KeyName.value = "Arrow Left";

      break;

      case 38:

      document.Form1.KeyName.value = "Arrow Up";

      break;

      case 39:

      document.Form1.KeyName.value = "Arrow Right";

      break;

      case 40:

      document.Form1.KeyName.value = "Arrow Down";

      break;
   }

}
</script>

If anyone's interested, here's how I did it:

$('input').focus(function(){
    $this = $(this);
    $this.parents('tr').css('background-color','yellow');   
    if($this.attr('click')!='true'){
        $('body').scrollTop($this.offset().top-($(window).height()/2));
    }
}).blur(function(){
    $(this).parents('tr').css('background-color','transparent');
}).mouseover(function(){
    $(this).attr('click','true');
}).mouseout(function(){
    $(this).removeAttr('click');
});