I have a DIV that appears on screen. I want this DIV to disappear if one clicks off the div OR if  they are using the keyboard, tabs out of the div.

The click part is fairly easy. When the div is shown, I attach a click event to the BODY:

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

To prevent the div closing if you click INSIDE the div, I stop event propogation:

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

That all works just fine. Now, I'm trying to have the same behavior happen via the keyboard, so if one tabs out of the div, it will hide.

I thought the solution might be to use focusin:


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

And then stop bubbling:


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

However, that does not work. I can't seem to stop focusin propogating outside of the div, there by triggering the event on the body and then immediately closing the div. Is my logic correct?