ОБНОВЛЕНИЕ 2:
Я спал на нем, а затем набрал пример кода, чтобы попытаться выяснить проблему.
Вот пример использования console.log firebug, чтобы показать вам, какой объект вызывает событие focusin:
http://jsbin.com/axefo3/11
1) нажмите на первую ссылку: желтый div показывает
2) нажмите клавишу табуляции: она должна войти в ссылку внутри желтого div
Он делает это, но затем запускает событие focusin и, по какой-то причине, кажется, снова всплывает к красному div, который, как говорят, затем закрывает желтый div.
Это даже после того, как я сказал желтому div, чтобы не распространять события фокуса:
$('#innerDiv').focusin(function(e){e.stopPropagation()});
Затем я попытался прикрепить событие focusin к родительскому div только ПОСЛЕ того, как я сосредоточился на внутреннем div.
http://jsbin.com/axefo3/16
Что происходит, так это то, что табуляция первой ссылки во внутреннем div устанавливает событие focusin для родительского div. Это хорошо! Но затем переход к следующей ссылке внутри innerdiv приводит к тому, что событие focusin снова закрывает div.
Так что, я думаю, я все еще в тупике. Похоже, я не могу удержать фокус от пузырения. Мысли? Теории?
Оригинальный пост ниже ...
============================
Я показываю div через событие onclick. Если вы нажмете за пределами div, я хочу скрыть это. Для этого я привязываю одноразовое нажатие на теле:
$('body').one('click.myDivPopup', function(e) {
...close my div...
});
Внутри самого div я говорю, чтобы он не распространял события, так что фактический щелчок внутри div не вызовет щелчок по телу:
$myDiv.click(function(e){e.stopPropagation()});
Работает нормально, как задумано.
Я также хочу скрыть div, если одна из вкладок из div.
Я думал, что в этом сценарии я мог бы использовать событие focusin на теле:
$('body').one('focusin.myDivPopup', function(e) {
...close my div...
});
Опять же, я не хочу, чтобы события всплыли из самого div, поэтому добавьте это:
$myDiv.focusin(function(e){e.preventDefault()});
Это НЕ работает. Изменение фокуса внутри элементов в myDiv вызывает событие focusin на теле.
Возможно, это ошибка в jQuery? Если да, есть ли лучший способ сделать это?
UPDATE:
Кажется, проблема в том, что нет никакого способа определить, потерял ли DIV фокус, поскольку он никогда не может фокусироваться. Моя логика решения состояла в том, чтобы увидеть, фокусировался ли что-то еще, что было вне div (следовательно, с использованием focusin), но я сталкиваюсь с проблемой событий focusin внутри div, которые, по-видимому, пузырились, вызывая его на теле.
Пока, я думаю, что мое решение должно будет добавить элемент CLOSE во всплывающее окно, а затем заставить людей явно вызывать это. Хотя не идеально, особенно для навигации с помощью клавиатуры.