Di bawah ini kita akan mempelajari cara membuat toggle password visibility dengan menggunakan JavaScript. Toggle Password Visibility dapat digunakan agar pengguna bisa melihat tulisan yang tersembunyi. Berikut ini contoh toggle password visibility yang akan kita pelajari :
<!DOCTYPE html> <html> <body> <p>Klik checkbox di bawah field password untuk melihat kata sandi:</p> Password: <input type="password" value="FakePSW" id="myInput"><br><br> <input type="checkbox" onclick="myFunction()">Lihat Password <script> function myFunction() { var x = document.getElementById("myInput"); if (x.type === "password") { x.type = "text"; } else { x.type = "password"; } } </script> </body> </html>
Toggle Password Visibility
Langkah 1) Tambahkan HTML:
Contoh
<!-- Field Password --> Password: <input type="password" value="FakePSW" id="myInput"> <!-- Elemen untuk melihat password --> <input type="checkbox" onclick="myFunction()">Show Password
Langkah 2) Tambahkan JavaScript:
Contoh
function myFunction() { var x = document.getElementById("myInput"); if (x.type === "password") { x.type = "text"; } else { x.type = "password"; } }