jquery focusin() и предотвращение пузырей

Question

ОБНОВЛЕНИЕ 2:

Я спал на нем, а затем набрал пример кода, чтобы попытаться выяснить проблему.

Вот пример использования console.log из firebug, чтобы показать вам, какой объект вызывает событие focusin:

http://jsbin.com/axefo3/11

1) нажмите на первую ссылку: желтый div показывает 2) нажмите клавишу табуляции: он должен перейти на ссылку в пределах желтого div

Он делает это, но затем запускает событие focusin и, по какой-то причине, кажется, снова всплывает к красному div, который, как говорят, затем закрывает желтый div.

Это даже после того, как я сказал желтому div, чтобы не распространять события focusin:

$('#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.

Я думал, что в этом сценарии я могу использовать фокусное событие на теле:

$('body').one('focusin.myDivPopup', function(e) {
    ...close my div...
}); 

Опять же, я не хочу, чтобы события выходили из самого div, поэтому добавьте это:

$myDiv.focusin(function(e){e.preventDefault()});

Это не работает. Изменение фокуса внутри элементов в myDiv вызывает событие focusin на теле.

Это может быть ошибка в jQuery? Если так, есть ли лучший способ сделать это?

ОБНОВИТЬ:

Кажется, проблема в том, что нет никакого способа определить, потерял ли DIV фокус, поскольку он никогда не может фокусироваться. Моя логика решения заключалась в том, чтобы увидеть, фокусировался ли что-то еще, что было вне div (следовательно, с использованием focusin), но я сталкиваюсь с вопросом о событиях focusin внутри div, которые, по-видимому, пузырились, вызывая его на теле.

На данный момент, я думаю, что мое решение должно состоять в том, чтобы добавить элемент CLOSE во всплывающее окно, а затем заставить людей явно вызывать его. Хотя не идеально, особенно для навигации с помощью клавиатуры.

Answer 1

Не было бы проще отобразить 2 деления. Один прозрачный (невидимый) div, который охватывает всю страницу, а другой вы действительно хотите показать. Тогда вам просто нужно установить z-index правильное тело

Затем зарегистрируйте событие click для невидимого div и при нажатии удалите оба. Законченный. По крайней мере, так работает большинство таких плагинов jquery для модального диалога

Демо http://jsbin.com/uzoyo/3

Answer 2

Если вы хотите использовать focusin, но не использовать всплывающее окно событий, почему бы вам просто не использовать focus...?