Focus () does not move the cursor to the field

Question

I am trying to get the cursor to return to the previous input when the value is incorrect. Here is a simpler version of the script I'm using:

$('input:first-child').blur(function(e){ console.log('here'); $('input:first-child').focus(); }); 

It works when I click on another element for focus, but not when I click on the body or another div element. What for? I have a jsfiddle case: http://jsfiddle.net/leyou/Zabn4/37/

Edit: I tested Chrome / Win7, but it seems worse with Firefox. It completely ignores focus ()

Answer 1

This is because the blur is not yet complete. Do this with a short timeout and this will work:

 $('input:first-child').blur(function(e){ setTimeout(function () { $('input:first-child').focus(); }, 20); }); 

Answer 2

try it

 $('input:first-child').blur(function(e){ console.log('here'); setTimeout(function() { $('input:first-child').focus(); }, 500); });