Domanda

Ho semplicemente voglia di nascondere un div, se una casella di testo non è più attivo, a meno che, l'utente fa clic in un altro certo div. Se l'utente fa clic quel particolare div, quindi il focusOut non fa scattare il div.box essere nascosti.

Di seguito è riportato il codice con la mia pseudocodice commentando. Tutte le idee?

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

Soluzione

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

Se si voleva evitare di aggiungere la variabile di bandiera, si potrebbe usare di jQuery .data per memorizzare il valore di flag contro es l'elemento div.stop, per esempio:

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

// ...

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

Modifica

Se si desidera consentire per la situazione in cui la casella di testo è attivo, e quindi si fa clic su div.stop, e non si vuole che nascondere, allora si potrebbe provare qualcosa di simile:

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

Altri suggerimenti

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

Prova questo!

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

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

semplice demo

note aggiunte:

  

.toggle (showOrHide)

     

showOrHide A booleano che indica se mostrare o nascondere gli elementi. Se questo parametro è true, poi il abbinato elementi sono mostrati ; se false, elementi sono nascosti .

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top