jQuery, herauszufinden, wenn der Elternteil verloren hat 'focus'

Bin ich stecken auf, herauszufinden, die Logik, um ein drop-down-Menü über die Tastatur möglich.

Den HTML strukturiert ist, wie eine solche (zusätzliche Klassennamen für Klarheit):

<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>

Link 1 und Link 2, wenn schwebte, zeigt die sub-Menü-Listen (pull-down-Menü). Ich habe diese arbeiten gerade fein mit einigen jQuery und die jQuery hoverIntent-plugin.

Der Haken ist, dass dies funktioniert nur mit der Maus auf den moment.

Nächste Herausforderung zu bekommen dies funktioniert über die Tastatur.

Kann ich ganz einfach ein focus-Ereignis, um die top-level-links, die dann Auslöser der sekundären Menüs:

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

Das funktioniert auch.

Schließen Sie das Menü, eine option ist, wenn ein weiteres Menü zu öffnen, überprüfen, um zu sehen, ob es anderen schon geöffnet und, wenn ja, schließen Sie es.

Dass funktioniert auch einwandfrei.

Wo das fehlschlägt, jedoch, ist wenn Sie haben die letzten Menü geöffnet, und die Registerkarte aus. Da Sie noch nicht im Registerformat in einem anderen Menü, das bleibt offen.

Die Herausforderung ist es, herauszufinden, wie/Wann das Menü zu schließen und die Logik, die nötig ist (jQuery), um es herauszufinden. Idealerweise würde ich das Menü schließen, wenn der Fokus auf ein element auf der ANDEREN Seite als eine der Menü ' s child-Elemente.

Logisch, ich bin auf der Suche nach:

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

Können Sie jedoch nicht tun, da die LI tatsächlich nicht gefasst, sondern der Anker-tag innerhalb es.

Irgendwelche Vorschläge?

UPDATE:

vielleicht eine bessere/einfachere Weg, die Frage zu stellen:

Per jQuery, gibt es eine Möglichkeit zu beobachten, um zu sehen, wenn der Fokus verschoben hat, außerhalb aller Kinder, die von einem bestimmten Objekt?

Ist es ein Tippfehler? $('ul.primaryMenuItem a:first').focus([call showMenu function]) --> $('li.primaryMenuItem a:first').focus...

InformationsquelleAutor DA. | 2010-02-03

Schreibe einen Kommentar