Reputation: 15594
I'm developing an element group and want to trigger some functionality when an elements' focusout
event triggers.
But I have to monitor how the focusout happened, which cause the focus out.
Assume the focusout
is bind for element A. if user click on the element B
the focusout should call the function_B
, if user click on the element C
the focusout should call the function_C
. And elements B,C should not be inside element A.
pseudo code :
$( element_A ).focusout(function() {
element_user_interaction = wether user clicks on element_B or element_C
if(element_user_interaction == element_B){
function_B();
}else if(element_user_interaction == element_C){
function_C();
}
});
I found a code from SO. see the accepted answer
$(document).mouseup(function (e)
{
var container = $("YOUR CONTAINER SELECTOR");
if (!container.is(e.target) // if the target of the click isn't the container...
&& container.has(e.target).length === 0) // ... nor a descendant of the container
{
container.hide();
}
});
I tried but could not change the above code to match for the pseudo code.
Upvotes: 1
Views: 183
Reputation: 2698
You should use the property of the event relatedTarget
.
$( element_A ).focusout(function(e) {
if(element_B.is(e.relatedTarget)){
function_B();
}else if(element_C.is(e.relatedTarget)){
function_C();
}
});
Warning: This property is null
if you click on something other than form elements i.e. image or text. Which is logical but could be confusing.
See more details at http://www.w3schools.com/jsref/event_focus_relatedtarget.asp
Upvotes: 2