Chrome (maybe Safari?) fires "blur" twice on input fields when browser loses focus Chrome (maybe Safari?) fires "blur" twice on input fields when browser loses focus google-chrome google-chrome

Chrome (maybe Safari?) fires "blur" twice on input fields when browser loses focus


The reason it is firing twice is because of window.onblur. The window blurring triggers a blur event on all elements in that window as part of the way javascript's capturing/bubbling process. All you need to do is test the event target for being the window.

var blurCount = 0;var isTargetWindow = false;$(window).blur(function(e){    console.log(e.target);    isTargetWindow = true;});$(window).focus(function(){    isTargetWindow = false;});$('input').blur(function(e) {    if(!isTargetWindow){                $('div').text(++blurCount + ' blurs');    }    console.log(e.target);});

http://jsfiddle.net/pDYsM/4/


This is confirmed Chrome bug. See the Chromium Issue Tracker

The workaround is in the accepted answer.


Skip 2nd blur:

var secondBlur = false;this.onblur = function(){    if(secondBlur)return;    secondBlur = true;    //do whatever}this.onfocus = function(){    secondBlur = false;        //do whatever}