jquery focusin() and preventing bubbling.

Posted by DA on Stack Overflow See other posts from Stack Overflow or by DA
Published on 2010-03-16T21:56:48Z Indexed on 2010/03/16 22:01 UTC
Read the original article Hit count: 201

Filed under:
|
|

I'm showing a div via an onclick event. If you click outside the div, I want to hide it. To do so, I'm binding a one time click event on the body:

$('body').one('click.myDivPopup', function(e) {
    ...close my div...
});     

Within the div itself, I tell it to not propogate events so that actually clicking within the div won't trigger a click on the body:

$myDiv.click(function(e){e.stopPropagation()});

This works fine as intended.

I also want to hide the div if one tabs out of the div.

My thinking was that in that scenario, I could use a focusin event on the body:

$('body').one('focusin.myDivPopup', function(e) {
    ...close my div...
}); 

Again, I don't want the events to bubble out of the div itself, so added this:

$myDiv.focusin(function(e){e.preventDefault()});

This does NOT work. Changing focus within elements within myDiv triggers the focusin event on the body.

Is this maybe a bug in jQuery? If so is there a better way to accomplish this?

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about focusin