Hallo sahabat dumenity berjumpa lagi dalam tutorial kursuswebdesign, pada tutorial kali ini saya akan membahas tentang Twitter Like Character Count Validasi Menggunakan jQuery. Twitter menggunakan jumlah karakter untuk membatasi jumlah masukan karakter oleh pengguna pada area input teks. Kita bisa melihat banyak situs yang memiliki area konten dibatasi oleh keterbatasan karakter. Mereka juga akan menunjukkan jumlah karakter yang diizinkan di dekat area konten. Penghitungan ini akan diperbarui dengan jumlah karakter yang tersisa pada teks mengetik secara dinamis di samping area konten.

Di Twitter, kotak tweet dibatasi oleh jumlah karakter yang akan diketik. Saat kita menulis lebih banyak teks, jumlah karakter akan masuk ke minus dan konten ekstra diketik disorot dengan latar belakang merah. Mari kita lakukan gimmick ini untuk area konten dengan kode sederhana tanpa menggunakan plugin editor . Saya menggunakan tag div dan jQuery yang dapat diedit untuk melakukan validasi jumlah karakter seperti Twitter

Area Konten yang Dapat Diedit menurut Batasan Jumlah Karakter

Kode HTML ini berisi elemen DIV yang dapat diedit. Pada mode edit, area konten yang dapat diedit dibatasi dengan jumlah karakter yang akan diketik oleh pengguna. Validasi batas karakter ini dilakukan dengan menggunakan jQuery saat mengetik teks di area konten.

Validasi Jumlah Karakter menggunakan jQuery

Kode ini menunjukkan fungsi jQuery yang dipanggil pada event ‘keyup’ dari area konten yang dapat diedit. Dalam kode ini, saya memperbaiki karakter maksimum yang diperbolehkan untuk diketik pada konten yang dapat diedit. Pada setiap tombol saya perbarui jumlah karakter yang tersisa. Setelah batas melebihi, maka saya menyoroti konten tambahan yang ditambahkan oleh pengguna seperti halnya dilakukan di kotak tweet Twitter.

Oke itulah tadi pembahasan saya tentang Twitter Like Character Count Validasi Menggunakan jQuery, semoga bermanfat.