1

使用此 HTML：

<div id="SomeDiv">
   <input id="SomeInput" />
   <div id="ChildDiv"></div>
</div>

我有一个分配给模糊事件的事件处理程序SomeInput。blur 事件处理程序检查是否SomeDiv或任何SomeDiv的孩子仍然有焦点，如果其中任何一个有焦点，则中止（按设计）。

问题是，当我SomeInput务实地调用 blur() on 时，SomeInput的 blur 事件处理程序运行，但由于它认为SomeDiv仍然有焦点而中止。

我已经尝试显式地模糊输入和父 div，但输入处理程序仍然认为父 div 是焦点。我也尝试过聚焦和模糊窗口和身体元素，这似乎没有任何作用。

如何同时模糊SomeInput、SomeDiv和SomeDiv的子级，因此当 SomeInput 的事件处理程序运行时，它不会将SomeDiv 视为焦点？

事件处理程序：

this.eBlur = function(event,eventThis) {
   console.log(this.$element.attr('id')+' has lost focus.');
   if(this.$element.has(":focus").length === 0){
      console.log('widget does not have focus');
      // do something.
   }
   else{
      console.log('something is still focused, do nothing.');
   }
}

var base = this;
this.$input.bind('blur', function(e){base.eBlur(e,this);});

然后执行：

console.log('about to blur');
this.$input.blur();
// The blur handler runs immediately here
console.log('blur complete');

所以日志显示：

about to blur
this.$element.attr('id')+' has lost focus.
something is still focused, do nothing.
blur complete
4

1 回答 1

0

发生这种情况的原因是blur事件在元素实际失去焦点之前触发。您必须将代码下推到堆栈中，以便它仅在元素实际模糊后执行。这可以通过将您的代码放入计时器中来完成（不需要延迟）：

$('#SomeInput').on('blur', function () {
    setTimeout(function () {
        // run your code here...
    }, 0);
});
于 2013-01-29T04:34:00.840 回答