Dialogelement – einfache Dialoge

Eiji Kitamura

In Chrome Canary wird jetzt das Dialogelement hinter einer Flagge unterstützt. Das dialog-Element kann für Pop-ups auf einer Webseite verwendet werden.

• show(): Dialogfeld öffnen.
• close(): Dialogfeld schließen. Verwendet ein optionales Argument, auf das dialog.returnValue gesetzt ist, sofern vorhanden.
• showModal(): Modales Dialogfeld öffnen.
• ::backdrop: Pseudoelement zum Gestalten des Hintergrunds hinter einem modalen Dialogfeld.
• close-Ereignis: Wird ausgelöst, wenn ein Dialogfeld geschlossen wird.

Aktualisierung vom 16. Dezember 2013

Das dialog-Element unterstützt jetzt:

• cancel-Ereignis: Wird ausgelöst, wenn die Esc-Taste in einem modalen Dialogfeld gedrückt wird. Dieser Termin kann über event.preventDefault() abgesagt werden.
• Attribut autofocus: Das erste Formularsteuerelement in einem modalen Dialogfeld mit dem Attribut autofocus (falls vorhanden) wird beim Anzeigen des Dialogfelds hervorgehoben. Gibt es kein solches Element, wird das erste fokussierbare Element fokussiert.
• form[method="dialog"]: nur innerhalb eines Dialogfelds gültig. Nach dem Senden des Formulars wird das Dialogfeld geschlossen und dialog.returnValue auf den Wert der verwendeten Schaltfläche „Senden“ gesetzt.

Sieh dir die Details per Live-Demo und Polyfill an.

Aktivieren Sie dazu unter chrome://flags/ die Option „Experimentelle Webplattform-Funktionen aktivieren“.