Menentukan Jumlah Karakter pada Textarea menggunakan Jquery
Hallo teman-teman, pada kesempatan kali ini saya akan membahas tentang cara Menentukan Jumlah Karakter pada Textarea menggunakan Jquery. Bagi yang sudah mengerti HTML pasti kenal dengan property MaxLength pada textbox. Contohnya:
Nama : <input type=”text” name=”nama” maxlength=”15″>
Artinya, jumlah maksimal karakter yang bisa di isikan pada input nama adalah 15 karakter. sedangkan, property MaxLength hanya bisa diterapkan pada input textbox, dan tidak berlaku pada textarea. Nah dengan sentuhan JQuery, kita bisa membatasi jumlah maksimal karakter yang diperbolehkan pada textarea.
Untuk lebih jelasnya langsung saja kita praktekan.
Pertama-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="karakter"cols="25" rows="7"></textarea> </p>
<span id="hitung">250</span> Karakter Tersisa.
</form>
</body>
</html>
Jika sudah 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>
Jika sudah silahkan simpan dan jalankan/run dibrowser yang kalian gunakan, maka hasilnya akan seperti dibawah ini :
Oke jika hasilnya seperti gambar diatas maka kalian telah berhasil Menentukan Jumlah Karakter pada Textarea menggunakan Jquery.
Sekian pembahasan kali ini, semoga bermanfaat dan sampai bertemu dipertemuan selanjutnya ya.
Terimakasih
Menentukan Jumlah Karakter Pada Textarea Menggunakan Jquery >>>>> Download Now
BalasHapus>>>>> Download Full
Menentukan Jumlah Karakter Pada Textarea Menggunakan Jquery >>>>> Download LINK
>>>>> Download Now
Menentukan Jumlah Karakter Pada Textarea Menggunakan Jquery >>>>> Download Full
>>>>> Download LINK KK