jQuery focusOut, кроме случаев, когда

Question

Я просто хочу скрыть div, если текстовое поле теряет фокус, если пользователь не нажимает на другой определенный div. Если пользователь щелкает этот конкретный div, фокусировка не вызывает скрытие div.box.

Ниже приведен код с комментированием моего псевдокода. Есть идеи?

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

Answer 1

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

Попробуйте это!

Answer 2

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

Если вы хотите избежать добавления переменной-флага, вы можете использовать jQuery .data для хранения значения флага, например, например. элемент div.stop, например:

$('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 3

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

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

простая демонстрация

добавлены примечания:

.toggle (showOrHide)

showOrHide Логическое значение, указывающее, отображать или скрывать элементы. Если этот параметр true, то соответствующие элементы отображаются ; если false, то элементы скрыты .