Mengukur Tingkat Kekuatan Password dengan JQuery

Fitur utama

• Menampilkan indikator kekuatan password dibawah textbox
• Muncul pesan pendek, antara buruk sedang atau kuat
• Muncul emotion yang menandakan kekuatan password

Source Code Seperti dibawah ini

1. Include Password strength meter javascript, file password.css dan password.js seperti ini

<script src="//code.jquery.com/jquery.min.js"></script>
<link rel="stylesheet" href="password.css">
<script src="password.js"></script>

2. Panggil fungsi password() dalam inputan

$('#YOUR-PASSWORD').password();

3. Config kekuatan password sebagai berikut

$('#password').password({

  // custom messages
  shortPass: 'The password is too short',
  badPass: 'Weak; try combining letters & numbers',
  goodPass: 'Medium; try using special charecters',
  strongPass: 'Strong password',
  containsUsername: 'The password contains the username',
  enterPass: 'Type your password',

  // show percent
  showPercent: true,

  // show text
  showText: true,

  // enable animation
  animate: true,
  animateSpeed: 'fast',

  // link to username
  username: false,
  usernamePartialMatch: true,

  // minimum length
  minimumLength: 4
  
});

4. Costum password

$('#events').password().on('password.score', function (e, score) {
  if (score > 75) {
    $('#submit').removeAttr('disabled');
  } else {
    $('#submit').attr('disabled', true);
  }
});

$('#events').on('password.text', (e, text, score) => {
  console.log('Called every time the text is changed (less up<a href="http://www.jqueryscript.net/time-clock/">date</a>d than password.score)')
  console.log('Current message is %s with a score of %d', text, score)
})

Download