Attributet type på <input> ändrar dess UI, skärmtangentbord (mobil) och inbyggd validering. Att använda rätt typ förbättrar användbarheten och ger kostnadsfri validering.
html
Attributet type på <input> ändrar dess UI, skärmtangentbord (mobil) och inbyggd validering. Att använda rätt typ förbättrar användbarheten och ger kostnadsfri validering.
Mobila tangentbord anpassar sig — type="email" visar nyckeln @, type="tel" visar en siffror-matta, type="number" visar siffror. Det här är i sig själv en stor användbarhetsvinst på telefoner.
Kostnadsfri validering — type="email" förkastar not-an-email vid inskickning, min/max begränsar siffror, type="url" kontrollerar för en giltig URL — ingen JavaScript krävs.
<input type="radio" name="plan" value="free" /> Free
<input type="radio" name="plan" value="pro" /> Pro
<!-- same name = mutually exclusive; only one can be selected -->
Att välja rätt indatatyp ger dig bättre mobila tangentbord, inbyggda väljare och inbyggd validering gratis — vilket förbättrar tillgängligheten och minskar JavaScript som du annars skulle behöva skriva.
Det är ett litet val med en oproportionerlig UX-vinst.