HTML 5
ukázka
popis
<input type="color" name="barva" value="blue">
Firefox a Chrome rozbaluje nabídku barev a odesílá je ve formátu %23rrggbb,
kde %23 je escape sekvence pro znak #, takže očekávaná hodnota je #rrggbb.
Jiné prohlížeče zobrazují jako input type="text"
<input type="date"
name="datum">
Chrome a Opera nechávají rozbalovat kalendář. Výstupní hodnota je rrrr-mm-dd.
Safari na iPhone a iPadu zobrazuje jako zadání data. Jiné prohlížeče zobrazují jako input type="text".
<input type="datetime"
name="datum-cas" value="obsah">
Opera zobrazuje jako dvě políčka, jedno na datum, druhé na čas.
Dopisuje šedivá písmenka UTC, jako že to je světový čas. Výstupní
formát je rrrr-mm-ddThh%3AmmZ, tedy např. 2012-04-06T12%3A02Z. Jiné
prohlížeče zobrazují jako input type="text".
<input type="datetime-local"
name="mistni-cas" value="obsah">
Chrome a Opera - jako datetime, výstupní formát je rrrr-mm-ddThh%3Amm,
tedy např. 2012-04-10T12%3A05. Od datetime se to liší tím Z na konci,
které zde chybí. Safari na iPhone a iPadu chce zadat datum. Jiné
prohlížeče zobrazují jako input type="text".
<input type="email"
name="email" value="obsah">
Chrome, Opera, IE a Firefox při odesílání kontrolují, jestli
obsahuje znak @ (zavináč). Všechny prohlížeče zobrazují jako input
type="text", liší se to jen tou kontrolou. Safari na
iPhone a iPadu zobrazuje v klávesnici zavináč, ale hodnotu
nekontroluje.
<input type="month"
name="mesic" value="obsah">
Opera umí rozbalit kalendářík, výstupní hodnota je rrrr-mm, tedy
např. 2012-04. Jiné prohlížeče zobrazují jako input type="text".
<input type="number"
name="cislo" value="20">
v Chrome a v Opeře se u inputu objeví šipečky umožňující měnit hodnotu.
Jiné prohlížeče zobrazují jako input type="text". Mobilní
prohlížeče zobrazují klávesnici s čísly.
<input type="range"
name="rozsah" value="4">
v Chrome, Safari a Firefoxu se místo inputu objeví šoupátko, kterým uživatel
hodnotu může měnit, ale nevidí pak, na jakou hodnotu se to změnilo!
Internet Explorer 11 zobrazuje modrý proužek s tooltipem, což mi
přijde nejlepší.
<input type="search"
name="hledani" value="obsah">
jako textové políčko s tím rozdílem, že vpravo je modrý
křížek, kterým lze hodnotu vymazat. Chrome, Firefox, Internet
Explorer. Safari křížek nezobrazí.
<input type="tel"
name="telefon" value="obsah">
jako input type="text", žádný rozdíl. Mobilní
prohlížeče zobrazují telefonní klávesnici.
<input type="time"
name="cas" value="obsah">
Chrome a Opera umí ukázat "hodinky" s dvojtečkou uprostřed. Výstupní
formát hh:mm:ss, escapovaně např. 04%3A02%3A00
<input type="url"
name="url" value="http://www.jakpsatweb.cz/">
jako input type="text", žádný rozdíl. Safari na iPhone
přidává do klávesnice lomítko, tečku a ".com".
<input type="week"
name="tyden" value="obsah">
Chrome a Opera umí rozbalit kalendář, výstupní hodnota je rrrr-Www, tedy
např. 2012-W15