Input türleri

text, email, password, number, date gibi input türlerini öğrenirsin.

Beş yaygın input türü

<input> etiketinin type özniteliği, alanın ne tür veri istediğini söyler. Beş yaygın tür şunlardır:

text — tek satır metin (ad, soyad)
email — e-posta; tarayıcı biçimi denetler
password — şifre; karakterler gizlenir
number — sayı; arttır/azalt düğmeleri çıkar
date — tarih; takvim seçici gelir

Tarayıcı her türü farklı gösterir ve uygun klavyeyi açar. Örnek: <input type="email" name="eposta">.

type ve tarayıcı denetimi

Bazı türler tarayıcıya ek denetim yaptırır. email yazdığında tarayıcı, değerde @ ve bir etki alanı olup olmadığına bakar; yoksa formu göndermez. number yalnızca rakam alır; date ise geçerli bir tarih ister.

Bu denetimler kullanıcının hata yapmasını azaltır. Yine de sunucu tarafında da denetlemek gerekir; çünkü tarayıcı denetimi atlanabilir. Örnek: <input type="date" name="dogum">.

Uygulama Beş türü dene

Form içine beş <input> ekle. Türleri sırayla text, email, password, number ve date olsun. Her birine farklı bir name ver.

Örnek çözümü göster

<form>
  <input type="text" name="ad">
  <input type="email" name="eposta">
  <input type="password" name="sifre">
  <input type="number" name="yas">
  <input type="date" name="dogum">
</form>

Kendini test et

Şifre giriş alanı için type özniteliğine hangi değer verilir?
- text
- password
- hidden
- secret
Cevabı göster

password — Doğru. type="password" yazılan karakterleri gizler.
Türü amacıyla eşleştir

type="email"

E-posta alanı
type="password"

Şifre alanı
type="number"

Sayı alanı
type="date"

Tarih alanı

Tarih alanını yaz

<input type="____" name="dogum">

Cevabı göster

<input type="date" name="dogum">

Sıradaki ders: Textarea ve button

Deneyiminizi Geliştiriyoruz

Çerez Tercihleri

Kesinlikle Gerekli Çerezler

Analitik Çerezler