孩子获得焦点时触发的模糊事件

Question

当and item失去焦点时，我需要执行一些操作。

基本上我有这样的东西：

<div tabindex="1">
    <h1>title 1</h1>
</div>

<div tabindex="2">
    <h1>title 2</h1>

    <textarea></textarea>
</div>

JS：

$('div').blur((e) => { console.log('blur');});

DEMO

现在，当您在div之间切换时，它就像一个符号符，但是当第二个div具有焦点，并且您单击子文本区域时，一个blur事件将被触发。这不是我想要的，因为我们仍然在同一个div中。我如何解决这个问题，当点击位于div之外时，只触发一个blur事件？

Answer 1

一个元素已经被聚焦，那么最后一个被聚焦的元素将触发事件'blur‘。您可能需要为it...something设计一个黑客攻击，如下所示：

$('div').blur((e) => {
    setTimeout(function() {
        if(!$('textarea').is(':focus')){
            console.log('blur');
        }
    }, 100);
});

setTimeout很重要，因为模糊事件是在第一个focus事件中触发的。