Question

I’ve noticed a strange issue with how Chrome handles javascript focus event. The fact is, it continuosly triggers focus event, even if it occurs only once. I’ve made a bit of research here and found questions where people run into the same issue when using alert(). When they close the alert window, the focus returns to their inputs and a handler triggers again and again. In my case, the problem is different, as I am using console.log(), and from time to time I get the same log 2 or even 3 times. I’ve noticed it usually happens when I clear the console, and then focus on an element. When I try to repeat it, it does not occur any more.

The scenario:

1. Clear console
2. Focus on element (2 or 3 console messages)
3. Focus on other identical element or unfocus and focus again on the
   same one (no problems)
4. Clear console
5. Focus on element (2 or 3 console messages – the problem is back!)

I’ve created a jsfiddle, please check it out:
http://jsfiddle.net/ffuWT/3/

The question is, what is the reason for this issue and how can I work around it?

Answer 1

I was able to recreate the problem (using your jsFiddle) and from what I can see it only occurs when you click the select without having focus on/in the result frame.

Click within the frame but not on the selects before you click to expand one of the selects and you´ll only see one line logged.

You can also append /show to the jsFiddle URL to view the result in a separate window.

It seems like focusing the window by clicking on a select control triggers the event multiple times.

Open this demo and unfocus the browser window (by clicking the desktop, taskbar or another window) and then click on one of the selects to expand its options and view the console.

Using Chrome 17.0.963.79 m.