当浏览器失去焦点时,Chrome(可能是Safari?)会在输入字段上激活两次"模糊"

Poi*_*nty 22 javascript safari google-chrome javascript-events

这是一个有趣的jsfiddle.

在Firefox中:

  1. 跑小提琴
  2. 单击文本输入
  3. 点击其他地方.应该说"1模糊".
  4. 再次单击文本输入.
  5. ALT-TAB到另一个窗口.小提琴现在应该说"2次模糊".

在Chrome中,在第5步,它显示"3次模糊".当整个浏览器失去焦点时,会触发两个单独的"模糊"事件.这是有意义的,因为它意味着在"模糊"处理程序中假设元素实际上在调度事件之前具有焦点是不安全的; 也就是说,失去焦点 - 从"聚焦"到"不在焦点"的过渡 - 是事件发生的原因.当生成两个 "模糊"事件时,在处理第二个事件期间不满足该条件,因为该元素已经不在焦点上.

这只是一个错误吗?有没有办法告诉"模糊"事件是假的?

Fre*_*all 18

两次射击的原因是因为window.onblur.窗口模糊会触发该窗口中所有元素的模糊事件,这是javascript捕获/冒泡过程的一部分.您需要做的就是测试事件目标作为窗口.

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);
});
Run Code Online (Sandbox Code Playgroud)

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