Entrar Ainda não tem acesso?
2
respostas

[Dúvida] Como colocar máscara de CPF em HTML?

por Diogo Bastos Mathias Netto
| 58k xp | 31 posts

Boa tarde, Preciso colocar uma máscara de CPF em um formulário de cadastro, fui em vídeo no youtue (https://www.youtube.com/watch?v=b3J9jhYFV0g) e achei o comando abaixo, solicitando que fosse colocado dentro da minha tag de head. Segue comando:

<!DOCTYPE html>
<html class="no-js" lang="en">
  <head>
    <script>
        function formatar(mascara, documento){
            var i = documento.value.length;
            var saida = mascara.substring(i)
            if (texto.substring(0,1) != saida) {
                documento.value += texto.substring(0,1);
            }
        }
    </script>
    <meta charset="utf-8">
</head>

No meu body eu chamo da seguinte forma segundo o mesmo vídeo:

<label>Telefone:</label>
<input type="text" name="tel" maxlength="12" OnKeyPress="formatar('##-#####-#####',this)">

Porém no meu HTML não funciona, enquanto o do vídeo sim. Não sei se faz diferença, mas eu estou usando o framework do python Flask, para sustentar e rodar o HTML/CSS.

Abraços e obrigado.

2 respostas
por Luis Dias
| 2699k xp | 2404 posts
Developer PHP (⌐■_■)

Oi, Diogo. Está faltando o texto = mascara.substring(i);

Fiz algumas melhorias

<!DOCTYPE html>
<html lang="pt-BR">
<head>
  <meta charset="utf-8">
</head>
<body>
  <label>Telefone:</label>
  <input type="text" name="tel" maxlength="15" OnKeyPress="formatar('(##) ####-#####',this)">
</body>
<script>  
  function formatar(mascara, documento) {
    let i = documento.value.length;
    let saida = '#';
    let texto = mascara.substring(i);
    while (texto.substring(0, 1) != saida && texto.length ) {
      documento.value += texto.substring(0, 1);
      i++;
      texto = mascara.substring(i);
    }
  }
</script>
</html>
por Diogo Bastos Mathias Netto
| 58k xp | 31 posts

Luiz, muito obrigado pela dica! :) S2

Abração

S2