Menghitung Karakter dengan Event onInput()

Terkadang dalam mengisi suatu form terdapat batasan jumlah maksimal karakter. Hal ini dikarenakan pada database terdapat jumlah karakter maksimal. Namun terkadang kita sebagai user pengguna jika menghitung jumlah karakter secara manual, akan memakan waktu lama. Begitu juga bila kita menggunakan aplikasi lain untuk menghitungnya.

Nah, dalam case ini kita akan membuat suatu form. Form tersebut nantinya akan menampilkan suatu jumlah karakter yang sudah kita tulis. Kita akan menggunaan element textarea sebagai menida penulisan form. Selain itu, kita juga akan menggunakan event oninput() yang disediakan pada javascript. Kita buat dahulu element textarea yang di dalamnya terdapat attriut oninput(). Begini codenya :

Seelah itu, pada bagian bawahnya kita buat element lain yang berfungsi untuk menampilkan hasil perhitungan string yang ditulis. Begini codenya :

 
Jumlah karakter : 0
 

Kemudian kita tambahkan javascript utuk menghitung jumlah karakter yang ditulis. Pada javascript ini kita tambahakan fungsi lenght untuk menghitungnya.

 
<script type="text/javascript">
function fungsi(){
	var string = $('#demo').val();
	$('#result').html(string.length)
}
</script>
 

Apabila ditulis secara keseluruhan, maka hasilnya akan seperti di bawah ini :

See the Pen
Untitled by codenya.com (@codenyacom)
on CodePen.

 
Mudah sekali bukan? demikianlah penjelasan singkat mengenai Menghitung Karakter dengan Event onInput(). Semoga bermanfaat untuk Anda.