Girdi Değerlerini Okuma
Metin, onay kutusu ve seçim girdilerindeki değerlere erişin.
Girdi Değerlerini Okuma, CoddyKit'te ücretsiz bir JavaScript Academy dersidir. Bu, 4 dersinin 1. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, JavaScript Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. JavaScript Academy kursu toplamda 4 dersten oluşur.
Form Verileriyle Çalışma
Formlar; metin kutuları, onay kutuları, radyo düğmeleri ve açılır listeler gibi alanlar aracılığıyla kullanıcı girdilerini toplar. Her alan, verilerini biraz farklı biçimde sunar.
input.value
Metin benzeri girdiler, geçerli içeriklerini her zaman dize olan value özelliği üzerinden sunar.
const name = document.querySelector("#name");
console.log(name.value);value Her Zaman Bir Dizedir
Sayı girdileri bile bir dize döndürür. Sayıya ihtiyaç duyduğunuzda açıkça dönüştürün.
const age = document.querySelector("#age");
const n = Number(age.value);valueAsNumber
Sayı ve tarih girdileri, doğrudan bir sayı döndüren valueAsNumber özelliğini sunar; alan boş veya geçersizse sayı olmayan bir değer döner.
const qty = document.querySelector("#qty");
console.log(qty.valueAsNumber);checkbox.checked
Onay kutuları durumlarını value yerine boole türündeki checked özelliğiyle bildirir.
const agree = document.querySelector("#agree");
console.log(agree.checked); // true or falseRadyo Düğmeleri
Bir radyo grubunda seçili olanı bulun. checked özelliği, seçilen seçeneği belirtir.
const selected = document.querySelector("input[name=plan]:checked");
console.log(selected ? selected.value : "none");select Değeri
Tek seçimli bir açılır liste, seçilen seçeneği value üzerinden sunar.
const country = document.querySelector("#country");
console.log(country.value);Çoklu Seçim
Çoklu seçim için selectedOptions değerini okuyup değerlerine dönüştürün.
const langs = document.querySelector("#langs");
const values = [...langs.selectedOptions].map((o) => o.value);input Olayı
Her tuş vuruşuna veya değişikliğe gerçek zamanlı olarak tepki vermek için input olayını dinleyin.
name.addEventListener("input", (e) => {
console.log(e.target.value);
});change Olayı
change olayı, bir alanın değeri değiştikten sonra alan odağını kaybettiğinde; onay kutuları ve seçim listelerinde ise hemen tetiklenir.
country.addEventListener("change", (e) => {
console.log("chose " + e.target.value);
});FormData
FormData, bir formun adlandırılmış tüm alanlarını tek seferde toplar ve sunucuya göndermek için idealdir.
const form = document.querySelector("form");
const data = new FormData(form);
console.log(data.get("name"));Hızlı Kontrol
Onay kutusunu doğru şekilde okuyun.
Özet
Metin girdilerini value ile okuyun; bu değer her zaman bir dizedir, sayılar için valueAsNumber kullanın. Onay kutularını ve radyo düğmelerini checked, açılır listeleri ise value veya selectedOptions ile okuyun. Her değişikliğe input olayıyla, onaylama sırasında ise change olayıyla tepki verin; tüm verileri tek seferde FormData ile toplayın.
Sıkça Sorulan Sorular
“Girdi Değerlerini Okuma” dersi ücretsiz mi?
Evet — “Girdi Değerlerini Okuma” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve JavaScript Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. JavaScript Academy kursu toplamda 4 dersten oluşur.
“Girdi Değerlerini Okuma” dersinde ne öğreneceğim?
Metin, onay kutusu ve seçim girdilerindeki değerlere erişin. JavaScript Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.
JavaScript Academy öğrenmeye başlamak için deneyim gerekli mi?
Önceden deneyim gerekmez. CoddyKit'te JavaScript Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 1. dersidir.
“Girdi Değerlerini Okuma” dersi ne kadar sürer?
Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.
Bu JavaScript Academy dersinde kod yazıp çalıştırabilir miyim?
Evet. Her JavaScript Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.
Bu kursun tüm dersleri
- Girdi Değerlerini Okuma
- submit Olayı
- İstemci Taraflı Doğrulama
- Kısıt Doğrulama API'si