JavaScript ile karakter girişi sınırlama

Benim en çok unuttuğum kodlar arasında yer alır kendisi ve de formlarda en çok kullandıklarım arasında aslı zatında çok basit ama bir o kadar da kolay unutulan bir kod.Fazla uzun etmeden çalışan bir haldeki kodu sizlerle paylaşayım. Çıktısını merak eden arkadaşlar buraya tıklayabilirler

<script type="text/javascript">
// fieldname, warningname, remainingname, maxchars
function CheckFieldLength(fn,wn,rn,mc) {
  var len = fn.value.length;
  if (len > mc) {
    fn.value = fn.value.substring(0,mc);
    len = mc;
  }
  document.getElementById(wn).innerHTML = len;
  document.getElementById(rn).innerHTML = mc - len;
}
</script>
<form>
<strong>textarea 1</strong>
<textarea name="taMessage" id="taMessage" cols="40" rows="5"
onkeyup="CheckFieldLength(taMessage, 'charcount', 'remaining', 20);" onkeydown="CheckFieldLength(taMessage, 'charcount', 'remaining', 20);" onmouseout="CheckFieldLength(taMessage, 'charcount', 'remaining', 20);"></textarea>
 <span id="charcount">0</span> characters entered. | <span id="remaining">20</span> characters remaining.
 
<strong>textbox 1</strong>
<input type="text" name="txtbox" id="txtbox" size="50" maxlength="50"
onkeyup="CheckFieldLength(txtbox, 'charcount3', 'remaining3', 10);" onkeydown="CheckFieldLength(txtbox, 'charcount3', 'remaining3', 10);" onmouseout="CheckFieldLength(txtbox, 'charcount3', 'remaining3', 10);"/>
<span id="charcount3">0</span> characters entered. | <span id="remaining3">10</span> characters remaining.
 
<strong>textarea 2</strong>
<textarea name="taMessage2" id="taMessage2" cols="40" rows="5"
onkeyup="CheckFieldLength(taMessage2, 'charcount2', 'remaining2', 50);" onkeydown="CheckFieldLength(taMessage2, 'charcount2', 'remaining2', 50);" onmouseout="CheckFieldLength(taMessage2, 'charcount2', 'remaining2', 50);"></textarea>
<span id="charcount2">0</span> characters entered. | <span id="remaining2">50</span> characters remaining.
</form>
Etiket(ler): , .Yer işareti koy Kalıcı Bağlantı.

Bir yanıt yazın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir