jQuery: implementare un misuratore di robustezza delle password compatibile con Bootstrap

Possiamo implementare in jQuery un misuratore di robustezza delle password compatibile con Bootstrap.

jQuery di Gabriele Romanato

Possiamo implementare in jQuery un misuratore di robustezza delle password compatibile con Bootstrap.

La soluzione è la seguente:


(function( $ ) {
  $.strength = function( element, password ) {
    var desc = [ { "width":"0px" }, { "width":"20%" }, { "width":"40%" }, { "width":"60%" }, { "width":"80%" }, { "width":"100%" } ];
    var descClass = [ "", "progress-bar-danger", "progress-bar-danger", "progress-bar-warning", "progress-bar-success", "progress-bar-success" ];
    var score = 0;

    if( password.length > 6 ) {
        score++;
    }

    if ( ( password.match(/[a-z]/) ) && ( password.match(/[A-Z]/) ) ) {
        score++;
    }

    if ( password.match(/\d+/) ) {
        score++;
    }

    if ( password.match(/.[!,@,#,$,%,^,&,*,?,_,~,-,(,)]/) ) {
        score++;
    }

    if ( password.length > 10 ) {
        score++;
    }

    element.removeClass( descClass[ score - 1 ] ).addClass( descClass[ score ] ).css( desc[ score ] );
  };

  $(function() {
      $( "#password" ).on( "keyup", function() {
          $.strength( $( "#progress" ), $( this ).val() );
      });
  });

})( jQuery );

Commenti