0 Compartilhamentos 1194 Views 7 Comments

Máscara para telefones de 8 e 9 dígitos – jQuery

Nesse código irei apresentar uma forma bem simples de colocar, em apenas um campo input, a máscara para telefones ou celulares de 8 e 9 dígitos usando jQuery. E a verificação com o atributo pattern, que só é válido para HTML5.

Para utilização da máscara iremos usar um plugin em jQuery, o jQuery Mask Plugin. Existem outras opção de plugins com finalidades semelhantes, mas esse nos atendeu perfeitamente!

Para baixá-lo acesso: http://plugins.jquery.com/mask/

Através desde link você também terá acesso a toda documentação do plugin. Dessa forma você poderá implementar facilmente outros tipos de máscaras.

Após o download, abra o arquivo zip e localize o arquivo: jquery.mask.min.js. Descompacte apenas ele no diretório onde estão os demais arquivos .js de seu site.

Em seguida vá até o código da sua página e faça a inclusão dele, da mesma forma que é feito com os outros arquivos do mesmo formato.

Em nosso caso, que o arquivo está no diretório js, a chamada ficou assim:

Em seguida no campo input do telefone, colocaremos o seguinte código:

Agora vou explicar um pouco do que foi feito.
O atributo pattern da tag input é responsável por validar o que está sendo digitado e o padrão deve sempre ser definido através de uma expressão regular.

Na linha seguinte é apresentada a chamada em jQuery do .mask. O padrão utilizado permite a digitação de apenas números, sendo que os 0 são de digitação obrigatória e o 9 é opcional.

Dessa forma o padrão de máscara pode ser utilizando tanto para telefones fixos com DDD e 8 dígitos quanto para celulares com DDD e 8 ou 9 dígitos.

Espero ter ajudo e até a próxima!

Você pode se interessar

Instalamos SSDs da Samsung em nossos Notebooks Dell (Veja se Performance Melhora) // Vlog #93
Vídeos
1,655 compartilhamentos6,807 visualizações
Vídeos
1,655 compartilhamentos6,807 visualizações

Instalamos SSDs da Samsung em nossos Notebooks Dell (Veja se Performance Melhora) // Vlog #93

Thais Cardoso de Mello - 18 de abril de 2019

Resolvemos mostrar pra vc o passo a passo do que fizemos na troca do HD para o SSD, incluindo a transferência automatizada dos dados e do sistema operacional, ou seja, não foi necessário reinstalar nada.

Como corrigir problemas de ERR_CONNECTION_TIMED_OUT no navegador
Dicas
7 visualizações
Dicas
7 visualizações

Como corrigir problemas de ERR_CONNECTION_TIMED_OUT no navegador

Carlos L. A. da Silva - 18 de abril de 2019

Mensagem de erro indica que estourou o tempo limite entre o navegador e o servidor do site. Há formas de contornar o problema.

O influenciador digital está morto?
Artigos
4 visualizações
Artigos
4 visualizações

O influenciador digital está morto?

Carlos L. A. da Silva - 17 de abril de 2019

A indústria e o consumo de jogos eletrônicos ainda sentem o impacto de influenciadores em plataformas de streaming? Os números não mentem.

7 Responses

  1. Estou há dias procurando uma forma simples e eficiente e não encontrava. Com essa ajuda posso fazer pra outras coisa na minha tabela. Muito obrigado!

    Resposta

Deixe uma Resposta para Rodolfo José Cancelar resposta

Your email address will not be published.

Mais publicações

SaaS // Dicionário do Programador
Vídeos
1,655 compartilhamentos6,813 visualizações
1,655 compartilhamentos6,813 visualizações

SaaS // Dicionário do Programador

Thais Cardoso de Mello - 15 de abril de 2019
Promoções de Jogos do Final de Semana (12/04)
Notícias
8 visualizações
8 visualizações

Promoções de Jogos do Final de Semana (12/04)

Carlos L. A. da Silva - 12 de abril de 2019
A cientista da computação que decifrou o buraco negro
Artigos
17 visualizações
17 visualizações

A cientista da computação que decifrou o buraco negro

Carlos L. A. da Silva - 11 de abril de 2019
Programamos um GAME com JavaScript Puro em 28 minutos // Mão no Código #10
Vídeos
1,655 compartilhamentos6,810 visualizações
1,655 compartilhamentos6,810 visualizações