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?
$('ul.primaryMenuItem a:first').focus([call showMenu function])
--> $('li.primaryMenuItem a:first').focus...
InformationsquelleAutor DA. | 2010-02-03
Du musst angemeldet sein, um einen Kommentar abzugeben.
Können Sie Ereignis-bubbling zu überprüfen, was hat den Fokus auf der focusin-Ereignis aus. Ich hatte Erfolg, mit dem folgenden code:
Könnte man(sollte) wahrscheinlich machen, mehr optimiert, aber es funktioniert.
Gut, es löst die focusin-Ereignis jederzeit ein focus-Ereignis tritt innerhalb der Körper, sondern konzentrieren sich in der Regel nicht sehr schnell ändern, und es wird eine begrenzte Anzahl von Elementen, die können das Ziel eines Fokus-Ereignis (links/Formular-Elemente) also ich persönlich glaube nicht, dass der Aufruf dieser Vergleich auf jeden focus-Ereignis wird Auswirkungen auf die Leistung zu viel. Sie könnten versuchen, zu optimieren, ist der Vergleich (ich bin mir nicht sicher, welche schneller ist $(e.Ziel ist).ist('ul.popUpMenu li a') oder B.), und Sie sollten cache-element Abfragen. Wenn die Leistung ist ein echtes Problem, Sie ausführen müssen einige benchmarks um zu überprüfen, die Auswirkungen.
focusin wird nicht ausgelöst, die in einigen Browsern für den body-tag (oder andere tags). Die Einstellung der tabindex-Eigenschaft auf " -1 " scheint dies zu beheben und macht diese Lösung eine gute Passform - $("body").attr("tabindex", -1);
InformationsquelleAutor emmychan
Verwenden Sie die neue jquery-1.4-Funktionen:
focusin
undfocusout
stattblur
undfocus
. Hier ist, wiefocusout
unterscheidet:InformationsquelleAutor Keltex
Wie wärs, wenn du das folgende tun:
#link_A_id > *
) nötig wäre und ich es nicht verwenden. Ich hatte auch wickeln Sie die if-Anweisung in einen timeout, weil derbody
element Stiehlt den Fokus, bevor das nächste element erhält den Fokus.InformationsquelleAutor D O
Versuchen, diese
Logisch, wenn Ihre Benutzer mit der Tabulatortaste aus, muss er sich darauf konzentrieren, den letzten Anker.
Könnten Sie sogar Ihre eigenen event-handler wie folgt:
und rufen Sie innerhalb der letzten Anker blur-Ereignis:
InformationsquelleAutor aefxx
Dies hat mir geholfen... http://plugins.jquery.com/project/focus
Wird es erkennen, wenn Sie noch in der Eltern automatisch. Es ist im Grunde ändert jQuery focusout auf diese Weise zu arbeiten statt, die ich fühle, ist, wie es funktionieren sollte.
Ich sehe nicht, warum das drücken der Tabulatortaste zum verschieben textfield zwischen den untergeordneten Elementen auslösen sollte focusout auf die Eltern, denn Sie sind noch immer innerhalb der übergeordneten. Etwas muss passiert sein, nimmt Sie aus, für einen moment, und ich vermute, dass es ein bug ist... jemand mit mir auf? Naja, wie auch immer das plugin oben behoben werden. Einfach schließen Sie es, bevor Sie Ihren code zu "beheben". Würde jemanden lieben, um zu erklären, warum dies ist nicht ein Fehler, wenn es nicht so ist.
Dank, Dom
InformationsquelleAutor Dominic Watson
Ich hatte ein ähnliches Problem... ich erstellt ein jsfiddle, um zu bestimmen, wenn ein Elternteil fieldset Fokus verliert und dann eine Funktion aufrufen. Es könnte sicherlich optimiert werden, aber es ist ein Anfang.
http://jsfiddle.net/EKhLc/10/
InformationsquelleAutor uxtx