Menampilkan Kekuatan Sebuah Password

Halo sob...

Bagaimana kabarnya hari ini???

Dari judulnya pasti temen-temen bertanya apa maksudnya???

Begini, biasanya saat kita ingin registrasi di sebuah forum atau lain sebagainya saat kita memasukkan password yang ingin digunakan, biasanya bukan hanya opsi untuk mengisi kembali password yang sudah dibuat, namun terkadang akan ditampilkan seberapa kuat password yang telah kita buat.

Hal ini dilakukan untuk memproteksi akun yang temen-temen buat, dimana semakin kuat password semakin sulit akun yang dilindungi password tersebut dapat dicuri atau lain sebagainya. Benar tidak???

Biasanya kuat tidaknya sebuah password bukan ditentukan seberapa panjang password tersebut, namun lebih pada variasi antara huruf, angka, dan simbol-simbol yang digunakan untuk membangun password tersebut.

Nah, setelah penjelasan pendek sempit diatas, maka kita juga dapat menerapkannya dengan menggunakan javascript dan kemudian dieksekusi menggunakan sebuah kode HTML.

$('#pass').keyup(function(e) {

     var strongRegex = new RegExp("^(?=.{8,})(?=.*[A-Z])(?=.*[a-z])

     (?=.*[0-9])(?=.*\\W).*$", "g");

     var mediumRegex = new RegExp("^(?=.{7,})(((?=.*[A-Z])(?=.*[a-z]))|

     ((?=.*[A-Z])(?=.*[0-9]))|((?=.*[a-z])(?=.*[0-9]))).*$", "g");

     var enoughRegex = new RegExp("(?=.{6,}).*", "g");

     if (false == enoughRegex.test($(this).val())) {

             $('#passstrength').html('More Characters');

     } else if (strongRegex.test($(this).val())) {

             $('#passstrength').className = 'ok';

             $('#passstrength').html('Strong!');

     } else if (mediumRegex.test($(this).val())) {

             $('#passstrength').className = 'alert';

             $('#passstrength').html('Medium!');

     } else {

             $('#passstrength').className = 'error';

             $('#passstrength').html('Weak!');

     }

     return true;

});

<input type="password" name="pass" id="pass" />

<span id="passstrength"></span>

Nah, sebelum mencoba ada baiknya lihat dulu demo nya dibawah ini sob...

Bagaimana???

Terima kasih ya, silahkan tinggalkan komentar dan semoga bermanfaat....