jQuery, выясняющий, потерял ли родитель 'фокус'

Question

jQuery, выясняющий, потерял ли родитель 'фокус'

Я застреваю при выяснении логики для создания клавиатуры выпадающего меню доступной.

HTML структурирован как таковой (дополнительные имена классов, используемые для ясности):

<ul>
    <li class="primaryMenuItem">
        <a href="">Link 1</a>
        <ul class="popUpMenu">
            <li><a href="">Sub Link 1</a></li>
            <li><a href="">Sub Link 2</a></li>
        </ul>
    </li>
    <li class="primaryMenuItem">
        <a href="">Link 2</a>
        <ul class="popUpMenu">
            <li><a href="">Sub Link 1</a></li>
            <li><a href="">Sub Link 2</a></li>
        </ul>
    </li>    
</ul>

Свяжитесь 1 и Ссылка 2 при парении покажет, что подменю перечисляет (опускающееся меню). У меня есть это работающее просто великолепно с некоторым jQuery и плагином jQuery hoverIntent.

Выгода - то, что это только работает с мышью в данный момент.

Следующая проблема состоит в том, чтобы заставить это работать через клавиатуру.

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

$('ul.primaryMenuItem a:first').focus([call showMenu function])

Это хорошо работает.

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

Это также хорошо работает.

То, где это перестало работать, однако, то, если у Вас есть последнее открытое меню, и вкладка из него. Так как Вы не снабдили вкладками в другое меню, этот остается открытым.

Проблема состоит в том, чтобы выяснить, как/когда закрыть меню, и логике было нужно (jQuery) для понимания этого. Идеально, я закрыл бы меню, когда фокус находится на элементе на странице Кроме любого из дочерних элементов меню.

Логически, я ищу это:

$('li.primaryMenuItem').blur([close $(this).find('ul.popUpMenu'))

Однако Вы не можете сделать этого, так как LI на самом деле не фокусируется, а скорее тег привязки в нем.

Какие-либо предложения?

ОБНОВЛЕНИЕ:

возможно, лучший/более простой способ задать вопрос:

С помощью jQuery, там способ 'смотреть', чтобы видеть, переместился ли фокус за пределами всех детей конкретного объекта?

6

jquery children blur

задан DA. 4 February 2010 в 00:07

3 ответа

Другие вопросы по тегам:

jquery children blur

Похожие вопросы:

score 6 · Answer 1

ints.Aggregate("", ( str, n ) => str +","+ n ).Substring(1);

Я также думал, что есть более простой способ. Не знаете о производительности, у кого-нибудь есть какая-то (теоретическая) идея?

-121--752905-

Убедитесь, что компилятор лицензий (lc.exe) может найти расположение сборок Infragistics. Кроме того, если компоненты были обновлены в последнее время, убедитесь в отсутствии нескольких копий с разными номерами версий. Наконец, убедитесь, что в файле licenses.licx используется одна и та же версия.

Простой способ обновления лицензии.licx - открыть дизайнер форм, добавить компонент Infragistics и удалить его.

Если по какой-либо причине файл licenses.licx не обновляется, можно сначала попытаться удалить ошибочные записи, а затем обновить их.

-121--1646523-

Можно использовать пузырь событий для проверки того, что фокусируется на событии focusin. У меня был успех со следующим кодом:


$("li:has(ul.popUpMenu)").focusin(function(e) {
    $(this).children().fadeIn('slow');
  });
  $('body').focusin(function(e) {
    if (!$(e.target).parent().is('ul.popUpMenu li')) {
      $('ul.popUpMenu').fadeOut('slow');
    }
  });

Вы могли (должны) сделать его более оптимизированным, но он работает.

score 2 · Answer 2

Используйте новые функции jquery 1.4: focusin и focusout вместо blur и focus . Вот чем отличается focusout :

Событие focusout отправляется элементу , когда он или любой элемент внутри теряет фокус. Это отличается от события размытия тем, что поддерживает обнаружение потери фокуса из родительских элементов (другими словами, поддерживает всплытие событий).

score 0 · Answer 3

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

$('li.primaryMenuItem:last li a:last').blur([do whatever you need to do])

По логике вещей, если ваш пользователь выходит на вкладку, он, должно быть, фокусировался на последней привязке.

Вы даже можете настроить свой собственный обработчик событий следующим образом:

$('li.primaryMenuItem:last').bind('myblur', function() ...);

и вызывать его в последнем событии размытия привязки:

...blur(function() {
    $(this).parents('li.primaryMenuItem').trigger('myblur'); ...