[Tutorial] Mostrar senha com checkbox

Autor: Rafaels.
Funcionalidade: Em todas as versões
Descrição: Consoante a claridade do quarto onde estamos ao escrever erramos a senha. Com este tutorial você ira aprender a adicionar um campo que permitira de mostrar a sua senha e verificar assim os eventuais erros.

Acesse:

Painel de Controle Módulos HTML & Javascript Gestão dos códigos Javascripts

E crie um novo javascript com investimento em todas as paginas com esse código:

Código:

$(function() {
    $('input[name="autologin"]').after('<input type="checkbox" id="mostrasenha"> Mostrar senha</input><br>');
    $("#mostrasenha").bind("click", function() {
        var txtPassword = $('input[type="password"]');
        if ($(this).is(":checked")) {
            txtPassword.after('<input onchange = "PasswordChanged(this);" id = "txt_' + txtPassword.attr("id") + '" type = "text" value = "' + txtPassword.val() + '" />');
            txtPassword.hide();
        } else {
            txtPassword.val(txtPassword.next().val());
            txtPassword.next().remove();
            txtPassword.show();
        }
    });
});
 
function PasswordChanged(txt) {
    $(txt).prev().val($(txt).val());
}

Código:

$(function () {
    $('input#autologin').before('<input type="checkbox" id="mostrasenha">&nbsp;Mostrar senha</input><br>');
            $("#mostrasenha").bind("click", function () {
                var txtPassword = $("input#password");
                if ($(this).is(":checked")) {
                    txtPassword.after('<input onchange = "PasswordChanged(this);" id = "txt_' + txtPassword.attr("id") + '" type = "text" value = "' + txtPassword.val() + '" />');
                    txtPassword.hide();
                } else {
                    txtPassword.val(txtPassword.next().val());
                    txtPassword.next().remove();
                    txtPassword.show();
                }
            });
        });
        function PasswordChanged(txt) {
            $(txt).prev().val($(txt).val());
        }

• Resultado: