Dropdown Menu
Dropdown-Menü
Ein Dropdown-Menü ist ein kurzlebiges Befehlsmenü, das von einem Button geöffnet wird und daneben bleibt. Sein übliches semantisches Muster ist ein Menü-Button plus ein Menü.
Ein echtes Beispiel
Eine Aktionsschaltfläche öffnet die Befehle PDF exportieren, Duplizieren und Verschieben und zeigt an, ob das Menü geöffnet ist. Escape schließt es und setzt den Fokus zurück auf die Schaltfläche. Ein Auswählen, das einen Formularwert auswählt, ist kein Dropdown-Menü.
Hauptteile
- 01Anker-Schaltfläche
- 02erweiterter Zustand
- 03Befehlsmenü
Verwenden Sie es, wenn
Verwenden Sie diesen Begriff für eine Befehlsliste, die an eine Schaltfläche gebunden ist, nachdem sie als Menü-Schaltflächen-Muster benannt wurde.
Nutze es nicht, wenn
Verwenden Sie dropdown nicht als allgemeinen Namen für ein Select, Combo-Box, Disclosure, Popover oder Tooltip.
In Code verwendeter Name
button[aria-haspopup=menu] → role=menu Vor dem Ausliefern
Move focus on purpose. Keep it inside only when the overlay blocks the page. Support Escape and a visible close button, then return focus to the opener. Keep entered data and check small-screen, loading, and failure states.
Outcome: Complete the task with Dropdown-Menü (Dropdown Menu). User context: Eine Aktionsschaltfläche öffnet die Befehle PDF exportieren, Duplizieren und Verschieben und zeigt an, ob das Menü geöffnet ist. Escape schließt es und setzt den Fokus zurück auf die Schaltfläche. Ein Auswählen, das einen Formularwert auswählt, ist kein Dropdown-Menü. Recommended pattern: Dropdown-Menü (Dropdown Menu). Why it fits: Verwenden Sie diesen Begriff für eine Befehlsliste, die an eine Schaltfläche gebunden ist, nachdem sie als Menü-Schaltflächen-Muster benannt wurde. Do not use it when: Verwenden Sie dropdown nicht als allgemeinen Namen für ein Select, Combo-Box, Disclosure, Popover oder Tooltip. Product requirements: Define the default, loading, empty, error, success, and recovery states. Keep user input. Give clear feedback after every action. Accessibility and resilience: Use semantic HTML, full keyboard access, and visible focus. Make the layout work when zoomed and support reduced motion. Follow the project’s current rules. Do not add a new UI library unless the project already uses it. Acceptance criteria: The main task works with keyboard only and at 320px width. Focus and status changes are announced. Check loading, failure, retry, cancel, and reduced-motion paths. Evidence and limits (evidence boundary): Kein einziger offizieller Standard kontrolliert den gesamten Begriff. Seine Bedeutung kann sich zwischen Teams, Plattformen oder Frameworks ändern. Unknowns to confirm: Product wording, data source, analytics events, supported devices and languages, and platform limits.
Diese Anfrage prüfen
Review how Dropdown-Menü (Dropdown Menu) is used now. Definition: Ein Dropdown-Menü ist ein kurzlebiges Befehlsmenü, das von einem Button geöffnet wird und daneben bleibt. Sein übliches semantisches Muster ist ein Menü-Button plus ein Menü. Release checks: Move focus on purpose. Keep it inside only when the overlay blocks the page. Support Escape and a visible close button, then return focus to the opener. Keep entered data and check small-screen, loading, and failure states. Before changing code, list the evidence, gaps, severity, and the smallest safe fix.