JQuery focus event not working for checkbox in Chrome browser

Question

I have a form that asks the client to answer questions in the text box, switch options and checkbox. I have a script that I need to capture the time spent by the client on the response. i.e. time difference between client request and field work time. I used an AJAX call to update the time on the server. Intime is captured using the jquery focusin event. The timeout is recorded using the jquery focus event.

The above methodology works in Firefox browser. However, in the Chrome browser, it encounters a problem in the focus event. The event does not fire for radio buttons and checkboxes. If I move from one text field to other fields, the jquery focus event fires properly. But the same does not work for radio buttons and checkboxes.

Can someone help me deal with this issue? Else can give some suggestion on how to capture intime and outime fields.

Fiddle for reference. Try this with chrome and firefox to see the difference.

$('input').focusout(function(){ alert("out"); });​ 

Answer 1

I would try this ...

 //Target just a checkbox $('input[type="checkbox"]').on('change', function() { alert('Blurred'); }); //Target just a radio button $('input[type="radio"]').on('change', function() { alert('Blurred'); }); //Target both $('input[type="radio"], input[type="checkbox"]').on('change', function() { alert('Blurred'); }); 

See an example: Fiddle