Input öznitelikleri
placeholder, required, pattern, min/max, step gibi öznitelikleri öğrenirsin.
placeholder ve required
Bir <input>'un davranışını özniteliklerle biçimlendirirsin. placeholder, alan boşken ipucu metni gösterir; kullanıcı yazınca kaybolur. Etiketin yerine kullanılmamalı; yalnızca beklenen biçimi gösterir.
required ise alanı zorunlu yapar. Boş bırakılırsa tarayıcı gönderimi engeller ve bir uyarı gösterir. Doğrulama sunucuda değil, tarayıcıda başlar; ama sunucu denetimi de her zaman gerekir.
pattern, min, max ve step
Sayısal ve metin alanlarında daha sıkı denetim istersen ek öznitelikler kullanırsın. pattern bir düzenli ifade alır; input değeri bu desene uymalı. Posta kodu için [0-9]{5} gibi.
Sayısal alanlarda min ve max alt ve üst sınırı, step ise artış miktarını belirler. step="0.01" ile on kuruşluk adımlar oluşturabilirsin.
Uygulama Doğrulamalı yaş alanı yaz
Form içine bir <input type="number"> ekle. name özniteliği yas, min özniteliği 18, max özniteliği 99, step özniteliği 1 ve required özniteliği olsun. Ayrıca placeholder özniteliğine Yaşınız yaz.
Örnek çözümü göster
<form>
<input type="number" name="yas" min="18" max="99" step="1" required placeholder="Yaşınız">
</form>Kendini test et
-
Hangisi yanlıştır?
- placeholder boş alanda ipucu gösterir
- required alanı zorunlu yapar
- pattern düzenli ifade ile doğrular
- placeholder etiketin yerine geçer
Cevabı göster
placeholder etiketin yerine geçer — Doğru. placeholder etiketin yerine geçmez; yalnızca ipucu verir.
-
Boş alanda ipucu gösterecek öznitelik
<input type="text" ____="Adınız">Cevabı göster
<input type="text" placeholder="Adınız"> -
Özniteliği rolüyle eşleştir
- placeholder
- Boş alanda ipucu
- required
- Zorunlu alan
- pattern
- Düzenli ifade denetimi
- step
- Artış miktarı
- min
- Alt sınır