Menentukan Jumlah Karakter pada Textarea menggunakan Jquery
Hallo teman-teman, di kesempatan kali ini saya akan membahas mengenai cara Menentukan Jumlah Karakter di Textarea menggunakan Jquery. Untuk yang telah paham HTML pasti kenal dengan property MaxLength di textbox. Contohnya:
Nama : <input type=”text” name=”nama” maxlength=”15″>
Artinya, jumlah maksimal karakter yang dapat di isikan di input nama yakni 15 karakter. sedangkan, property MaxLength hanya dapat dipakai di input textbox, dan tak berlaku di textarea. Nah dengan sentuhan JQuery, kita dapat membatasi jumlah maksimal karakter yang diperbolehkan di textarea.
Bagi lebih jelasnya seketika saja kita praktekan.
Pertama-tama-tama ketik script html berikut ini kedalam text-editor kalian dan simpan dengan nama index.html :
<html>
<head>
<title>Menentukan jumlah karakter ditextarea</title>
</head>
<body>
<form>
<p>(Jumlah Karakter Maksimal: 250) </p>
<p><textarea id=karaktercols=25 rows=7></textarea> </p>
<span id=hitung>250</span> Karakter Tersisa.
</form>
</body>
</html>
Sekiranya telah ketik script jquery dibawah ini dan masukan didalam tag head html :
<script type=text/javascript src=https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.js></script>
<script type=text/javascript>
$(document).ready(function() {
$('#karakter').keyup(function() {
var len = this.value.length;
if (len >= 250) {
this.value = this.value.substring(0, 150);
}
$('#hitung').text(250 - len);
});
});
</script>
Sekiranya telah silahkan simpan dan jalankan/run dibrowser yang kalian gunakan, karenanya hasilnya akan seperti dibawah ini :
Oke sekiranya hasilnya seperti gambar diatas karenanya kalian telah berhasil Menentukan Jumlah Karakter di Textarea menggunakan Jquery.
Demikianlah pembahasan kali ini, semoga bermanfaat dan hingga bertemu dipertemuan berikutnya ya.
Terimakasih
Sumber https://kursuswebsite.org
