Javascript Contar variedades de caracteres numa string com javascript

xrogerinho · 22 de setembro de 2020

Olá,

Quero validar o campo senha de meu formulário exigindo um número mínimo de caracteres diferentes.

Obs. não quero exigir letras maiúsculas, números ou símbolos, apenas que o campo possua um mínimo de caracteres diferentes para evitar senha repetitiva.

GabrielSennaMs · 23 de setembro de 2020

@xrogerinho Bom amigo em uma string você pode recuperar o número de caracteres pela propriedade length, desa forma você pode validar o campo.

Exemplo de uso:

<!DOCTYPE html>
<html lang="pt_BR">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Input</title>
    </head>
    <body>
        <div>
            <p>Número de caracteres digitados no input: <span id="demo"></span></p>
        </div>
        <form onsubmit="return false;">
            <input autocomplete="passowrd" id="password" type="password">
        </form>
        <script>
            window.onload = function()
            {
                const demo = document.getElementById('demo');

                document.getElementById('password').addEventListener('keyup', function(event)
                {
                    let value = event.target.value;

                    demo.innerHTML = value.length;
                });
            }
        </script>
    </body>
</html>

Você também pode usar o minlength do HTML 5, link de referencia: https://www.w3schools.com/tags/att_input_minlength.asp

Aqui tem alguns tutoriais de como você pode usar o javascript para manipular input https://www.w3schools.com/js/js_input_examples.asp.

xrogerinho · 23 de setembro de 2020

Muito agradecido nobre amigo @GabrielSennaMs, eu até já tenho uma script que valida o tamanho mínimo do campo, veja:

if(frm.senha.value.length < 6) {
alert('Senha muito curta!');
return false;

porém, eu quero validar a força da senha pela variação de caracteres, para que o usuário não digite uma senha muito simples tipo 111111, 121212, exigindo que a senha tenha um mínimo de caracteres distintos.

Eu queria contar quantos tipos de caracteres diferentes possui o campo. Exemplo: 121212 = 2 caracteres distintos, 123123 = 3 caracteres distintos, etc

GabrielSennaMs · 23 de setembro de 2020

@xrogerinho

3 horas atrás, xrogerinho disse:

Eu queria contar quantos tipos de caracteres diferentes possui o campo. Exemplo: 121212 = 2 caracteres distintos, 123123 = 3 caracteres distintos, etc

Seria algo assim?

<!DOCTYPE html>
<html lang="pt_BR">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>input</title>
    </head>
    <body>
        <div>Número de variação de caracter: <span id="demo"></span></div>
        <form onsubmit="return false">
            <input id="password" type="password">
        </form> 
        <script>
            window.onload = function()
            {
                const demo = document.getElementById('demo');

                document.getElementById('password').addEventListener('keyup', function(event)
                {
                    let 
                        value = event.target.value,
                        caracteres = {},
                        num = value.length;

                    for(let len = 0; len < value.length; len++)
                    {   
                        if (!caracteres[value[len]])
                        {
                            caracteres[value[len]] = 1; 
                        }
                        else
                        {
                            caracteres[value[len]]++;
                            num--;
                        }
                    }
                    
                    demo.innerHTML = num;
                })
            }
        </script>
    </body>
</html>