如何獲取哪個元素導致模糊事件的div

Question

一個div具有界限focusout事件。 OnFocusOut（方法名稱）事件一些代碼正在執行。但我想要哪個元素導致focusout事件。如果e.relatedTarget是div的子元素，則不執行OnFocusOut方法中的代碼。

我試過e.relatedTarget（在谷歌瀏覽器上工作），但是這個變量不支持firefox（不支持）。所以我想要一些支持所有瀏覽器的e.relatedTarget替代解決方案。

編輯

jsfiddle

如在輸出顯示器，

Container21是contentEditable DIV具有綁定focusOut事件。

我想，如果用戶點擊以外container22然後doSomthing()

一個限制是我不能在剩餘的元素添加單擊事件。

Answer 1

如果您Container22是可以有焦點的元素，你可以檢查它是否已集中在模糊事件：

$('#container21').blur(function(){ 
    // timeout because focus does not switch immediately 
    setTimeout(function(){ 
     if (document.activeElement === document.getElementById('container22')) { 
      // your logic here: container22 has focus 
     } else { 
      // your logic here: container22 does not have focus 
     } 
    }, 60); 
}); 

如果Container22不能具有焦點，你可以給它一個類來代替：

$('#container22').click(function(){ 
    $(this).addClass('fake-focus'); 
}); 

您刪除該類時Container21獲得焦點：

$('#container21').focus(function(){ 
    $('#container22').removeClass('fake-focus'); 
}); 

你檢查FO當Container21失去焦點時 - 如果Container22具有該類，則表示用戶單擊它以集中注意力。我們需要再次超時，因爲焦點丟失後，點擊事件將發生。

$('#container21').blur(function(){ 
    // timeout because focus does not switch immediately 
    setTimeout(function(){ 
     if ($('#container22').hasClass('fake-focus')) { 
      // your logic here: container22 was clicked 
     } else { 
      // your logic here: container22 was not clicked 
     } 
    }, 60); 
});