1 Reaktion

Firefox 53: Unterstützung für Datums- und Uhrzeit-Wähler in HTML

Geschätzte Lesedauer:

Der HTML-Standard sieht verschiedene Eingabe-Typen für verschiedene Aufgaben vor. So gibt es Eingabefelder für Texte, Zahlen, Passwörter, Farben und eben auch für das Datum und die Uhrzeit. Ab Firefox 53 unterstützt der Mozilla-Browser die Eingabe-Typen für Datum und Uhrzeit, so dass Webentwickler künftig auf keine JavaScript-Bibliothek mehr zurückgreifen müssen, um eine entsprechende Auswahl anzuzeigen.

Ein HTML-Code wie <input type=’text‘ /> kommt vermutlich allen Webentwicklern bekannt vor, denn diese einfachste Form eines Eingabefelds repräsentiert ein simples Textfeld und gehört zum Standard-Reportoire eines jeden Browsers, genau wie Passwort-Felder, Checkboxen, Radio-Buttons oder Upload-Felder für Dateien.

Daneben kamen mit HTML5 noch einige spezialisierte Eingabefelder dazu, wie für die Auswahl von Nummern, E-Mail-Adressen oder Farben. Bei den neuen Eingabe-Typen sieht es mit der browserübergreifenden Unterstützung nicht ganz so gut aus. Denn trotz grundlegender HTML5-Unterstützung in allen modernen Browsern hängt es bei Eingabefeldern vom jeweiligen Eingabe-Typ ab, ob ein Browser dieses unterstützt oder nicht. Unterstützt ein Browser einen Eingabe-Typ nicht, stellen alle Browser ohne Unterstützung dieses automatisch als simples Text-Eingabefeld dar.

Firefox 53 hat eine erste Unterstützung für <input type=’date‘ />und <input type=’time‘ /> erhalten, allerdings standardmäßig noch deaktiviert. Die Aktivierung erfolgt über about:config, indem die Schalter dom.forms.datetime respektive dom.forms.datetime.timepicker jeweils per Doppelklick auf true geschaltet werden.

Auswahlfelder für ein Datum oder eine Uhrzeit kennt man von vielen Webseiten. Diese werden bisher aber üblicherweise durch verschiedene JavaScript-Bibliotheken implementiert – und funktionieren dementsprechend auch nur, wenn der Nutzer JavaScript aktiviert hat. Durch die Verwendung von <input type=’date‘ /> und <input type=’time‘ /> können Browser nativ Auswahlfenster für das Datum oder die Uhrzeit implementieren, ohne dass eine JavaScript-Bibliothek hierfür eingesetzt werden muss. So steht diese Funktion allen Nutzern zur Verfügung, außerdem kann im Idealfall auch die Ladezeit der Webseite davon profitieren, wenn eine JavaScript-Bibliothek weniger geladen werden muss.

Darstellung von <input type=’date‘ /> in Firefox:

<input type='date' /> in Firefox

Darstellung von <input type=’time‘ /> in Firefox:

<input type='time' /> in Firefox

Dieser Artikel wurde von Sören Hentzschel verfasst.

Sören Hentzschel ist Webentwickler und Mozilla Repräsentant (Alumnus). Neben diesem Mozilla-Blog betreibt er unter anderem noch firefoxosdevices.org sowie das Fußball-Portal Soccer-Zone und ist außerdem Administrator des deutschsprachigen Firefox Hilfeforums Camp Firefox.

1 Kommentar - bis jetzt!

Eigenen Kommentar verfassen
  1. Tom
    schrieb am :

    Hier eine Seite, wo man das testen kann.

    http://www.456bereastreet.com/lab/html5-input-types/

Und jetzt du! Deine Meinung?

Erforderliche Felder sind mit einem Asterisk (*) gekennzeichnet. Die E-Mail-Adresse wird nicht veröffentlicht.