Merhabalar,
Bu yazımda Javascript ile bir input, textarea vb. değer girilebilen elemanlara karakter girildikçe bu sayıyı ekrana basan bir uygulama örneğinden bahsedeceğim.
Bazı formlarda görebilirsiniz ayrıca HTML üzerinde onkeyup attribute (niteliği) kullanımını kavramanız açısından da güzel bir örnek olacaktır. Her tuşa basıldığında bir fonksiyon çalıştıracak fonksiyon adını tırnak içine yazacağız.
Fonksiyonun içinde ise de metin uzunluğunu alıp ekrana basacağız her bir girişte fonksiyon kendini güncelleyecek bu sayede güncel değerler yazılacaktır.
Hemen başlayalım ben örnek olarak textarea kullanacağım ama input elemanlarında da onkeyup kullanabilirsiniz.
<textarea onkeyup="karakterSay(this.value);" rows="5"></textarea>
<p><b>Toplam Karakter: </b> <span id="sonuc"></span> </p> karakterSay() fonksiyonu her bir karakter girişinde onkeyup niteliğiyle birlikte çalışacaktır.
Hemen altında ise toplam karakteri gösteren bir metin ve toplamı gösteren sonuc id’li bir span ekledim.
Javascript tarafında da karakterSay() fonksiyonunu oluşturalım.
<script>
function karakterSay(metin)
{
var toplam = metin.length; // parametreden gelen uzunluk
document.getElementById("sonuc").innerHTML = toplam;
// sonuc id'li elemana bu degeri yazdir.
}
</script> İşlemimiz bu kadar. Her karakter girildiğinde alt kısımda toplam karakteri güncelleyen bir işlem olmuştur. If else ile sınır koyabilir veya farklı şekillerde değerlendirebilirsiniz.
Umarım anlaşılır olmuştur ve işinize yarar.
Mutlu Kodlamalar 🙂
