jQuery focusOut außer wenn

Question

Ich möchte einfach ein div verstecken, wenn ein Textfeld den Fokus verliert, es sei denn, der Benutzer klickt in einem bestimmten anderen div. Wenn Benutzer klickt, dass bestimmte div, dann ist die focusout nicht die div.box auslöst versteckt wird.

Im Folgenden finden Sie Code mit meinem Pseudo-Code zu kommentieren. Irgendwelche Ideen?

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();
});

Wenn Sie die Flag-Variable vermeiden wollte hinzufügen, könnten Sie jQuery .data den flag-Wert zu speichern, zB gegen das div.stop Element, z:

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

// ...

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

Bearbeiten

Wenn Sie die Situation zulassen möchten, wo das Textfeld den Fokus hat, und Sie dann auf div.stop klicken, und Sie wollen nicht, es zu verbergen, dann könnte man versuchen, so etwas wie:

$('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();
});

Versuchen Sie dies!

Answer 3

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

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

einfache Demo

hinzugefügt Anmerkungen:

.toggle (showOrHide)

showOrHide Ein boolescher der angibt, ob die Elemente ein- oder ausblenden. Wenn diese Parameter true sind, dann abgestimmt der -Elemente angezeigt ; wenn false sind die Elemente versteckt .