Mostrare e nascondere la password che l'utente sta inserendo è un utile caratteristica che può essere aggiunta ai nostri form per migliorarne l'usabilità. In JavaScript la soluzione è molto semplice.
Si tratta di sfruttare l'evento change su una checkbox e modificare l'attributo type del campo password in base al valore della proprietà checked:
var PasswordToggler = function( element, field ) {
this.element = element;
this.field = field;
this.toggle();
};
PasswordToggler.prototype = {
toggle: function() {
var self = this;
self.element.addEventListener( "change", function() {
if( self.element.checked ) {
self.field.setAttribute( "type", "text" );
} else {
self.field.setAttribute( "type", "password" );
}
}, false);
}
};