Assalamualaikum warahmatullahi wabarakatuh
Selamat pagi semuanya. pada pagi ini saya akan share Tutorial Cara Mudah Membuat Show Hide Password Menggunakan Jquery . Show Hide Password Adalah sebuah fitur yang di gunakan untuk memunculkan sebuah text yang kita ketikan di dalam form password.
Namun apa manfaat show hide ini ? yaitu untuk meminimalisir kesalahan suatu user untuk mengetikan password dengan mudah. Sehingga user pun tahu apakah password yang dimasukkan sudah benar atau belum. Lalu Bagaimana cara membuatnya. yuk langsung saja di simak tutorial berikut ini
- Langkah Pertama buka code editor kalian. Disini saya pakai sublime text. kalau sudah masukkan coding di bawah ini dan save dengan nama index.html
<html> <head> <meta charset="UTF-8"> <title>Show Hide Password</title> </head> <body> <form action=""> <label for="">Username</label><br> <input type="text" required=""><br> <label for="">Password</label><br> <input type="password" id="ShowPass" required=""><br> <input type="checkbox" onclick="myFunction()"> Show Password<br><br> <button type="submit">Save</button> </form> </body> </html>
- Kemudian di bawa tag <html> masukkan koding seperti di bawah ini jangan lupa di save
<!-- Script Show Hide Password --> <script> function myFunction(){ var x = document.getElementById("ShowPass"); if (x.type === "password") { x.type = "text"; }else{ x.type = "password"; } } </script>
- Fungsi ShowPass ini di jalankan untuk menampilkan dan menyembunyikan password. bisa kalian ganti dengan kata yamg lain
- Coba kalian Jalankan File index.html nya dan hasilnya akan seperti di bawah ini
Jika kalian ingin source codenya bisa download disini
Password: muhdannyblog
Mungkin Cukup Sekian Artikel Cara Mudah Membuat Show Hide Password Menggunakan Jquery , kurang lebihnya mohon maaf.
Jika ada yang ingin di tanyakan silahkan komentar dibawah
Wassalamualaikum warahmatullahi wabarakatuh
Comments
Post a Comment