One div
has a bounded focusout
event. OnFocusOut
(method name) event some code is getting executed. But i want which element causes focusout
event. If e.relatedTarget
is child elements of that div
then don't execute code from OnFocusOut
method.
I tried e.relatedTarget
(working on google chrome), but this variable does not work with firefox(does not support). So i want some alternate solution for e.relatedTarget which supports for all browsers.
Edit
As displays in output,
Container21
is contentEditable
div which has focusout event binded.
i want if user clicks on other than container22
then doSomthing()
One restriction is i can not add click event on remaining elements.
If your Container22 is an element that can have focus, you can check if it has focus in your blur event:
$('#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);
});
If Container22 cannot have focus, you can give it a class instead:
$('#container22').click(function(){
$(this).addClass('fake-focus');
});
You remove the class when Container21 gains focus:
$('#container21').focus(function(){
$('#container22').removeClass('fake-focus');
});
And you check for the class when Container21 loses focus - if Container22 has the class, that means the user clicked it to focus out. We need a timeout again, because the click event will happen after focus is lost.
$('#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);
});
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments