Hai teman-teman semuanya, apa kabar? gimana masih semangat belajarnya, kita lanjut lagi ya pembahasan kita tentang javascript pada kesempatan ini kita akan membuat fungsi password match dengan javascript.
pada kasus ini idenya kita akan membuat sebuah inputan yang dibana ketika inputannya kita isi dengan nilai benar sesuai dengan yang kita tentukan maka akan menampilkan pesan sukses, mungkin masih bingung yah, kita langsung saja praktekan, sekarang silahakan teman-teman buat sebuah file html dan ketikan script berikut ini:
|
1 2 |
<input type="password" name="password" id="password"> <span id="error"></span> |
Saya membuat sebuah inputan dangan id password, lalu dibawahnya saya membuat sebuah span dengan id erorr yang nanti akan kita gunakan untuk membuat pesan eror dan suksesnya,
jika sudah maka hasilnya akan seperti berikut ini:
Sekarang kita masuk pada scripting javascriptnya, silahakan teman-teman ketikan script berikut ini:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
<script> var truePassword = 'dumetschool' var password = document.getElementById('password') var error = document.getElementById('error') password.addEventListener('keyup', function(){ if(password.value == truePassword){ error.innerText = 'password anda benar' error.style.color = 'green' }else{ error.innerText = 'password anda salah' error.style.color = 'red' } }) </script> |
Saya membuat sebuah variable truePassword sebagai nilai password yang benar, lalu saya mebuat sebua fungsi event dengan addEventListener keyup dimana didalamnya saya membuat sebuah stetment apabila password.value(nilai variable password) sama dengan bilai truePassword akan menjalankan suatu stetment yang bisa teman-teman lihat diatas, begitu juga dengan kondisi salahnya,
Jika sudah silahkan teman-teman ketikan yang tidak sesuai dengan nilai truePassword hasilnya akan seperti ini :
Dan jika teman-teman isi dengan benar sesuai dengan nilai pada variable truePassword maka hasilnya akan seperti berikut ini
Oke teman-teman untuk tutorial kali ini tentang fungsi password match dengan javascript saya rasa cukup samapi sini dulu, semoga bermanfaat, terima kasih