JQuery focusOut except if

Question

I just want to hide the div if the text field loses focus, unless the user clicks in another specific div. If the user clicks on this particular div, then the focus does not cause the div.box to be hidden.

Below is the code with pseudocode comments. Any ideas?

textInput.focusout(function() {
    // So long you didn't click div.stop, then
        $('div.box').hide();
});

Answer 1

var flag = false;

$('div.stop').click(function() {flag = true;});
textInput.focusout(function() {
    // So long you didn't click div.stop, then
    if(!flag)
        $('div.box').hide();
});

If you want to avoid adding a flag variable, you can use jQuery .data to save the flag value, for example. element div.stopfor example:

$('div.stop').click(function() {$(this).data('clicked', true);});

// ...

    if(!$('div.stop').data('clicked'))
// ...

EDIT

, , div.stop, , , - :

$('div.stop').click(function() {$('div.box').stop();});
textInput.focusout(function() {
    // So long you didn't click div.stop, then
    $('div.box').delay(200).hide();
});

Answer 2

$(document).bind('click',function(e) {
  if ($(e.target).closest('div.box').length) return;
  $('div.box').hide();
});

!

Answer 3

var flag = false;
$('#inputID').blur(function(){
   $('div.box').toggle(flag);       
});

$('#someDIVid').click(function(){
    flag = true;
});

:

.toggle (showOrHide)

showOrHide A boolean value that indicates whether to show or hide items. If this parameter true, then consistent items are displayed; if false, elements are hidden.