0 Compartilhamentos 232 Views 6 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

Desconfiômetro: aprenda a detectar notícias falsas
Artigos
3 visualizações
Artigos
3 visualizações

Desconfiômetro: aprenda a detectar notícias falsas

Carlos L. A. da Silva - 26 de Março de 2018

No dia 12 de Março, a vereadora carioca Marielle Franco (PSOL) foi assassinada próxima ao Centro da cidade do Rio de Janeiro, junto com o motorista do carro que a levava. O crime serviu de estopim para uma comoção nacional e também se tornou um caso emblemático para o estudo do processo de criação e […]

Promoções de Jogos do Final de Semana (23/03)
Notícias
2 visualizações
Notícias
2 visualizações

Promoções de Jogos do Final de Semana (23/03)

Carlos L. A. da Silva - 23 de Março de 2018

Confira as melhores ofertas de jogos de PC para o final de semana.

Entrevista: Gabriel Fróes no DevNaEstrada
Entrevistas
2 compartilhamentos19 visualizações
Entrevistas
2 compartilhamentos19 visualizações

Entrevista: Gabriel Fróes no DevNaEstrada

Redação - 23 de Março de 2018

Gabriel Fróes é o entrevistado do DevNaEstrada. Ele fala sobre a sua trajetória profissional e seus projetos ao longo de 20 anos na área de TI.

6 Responses

Deixe um Comentário

Your email address will not be published.

Mais publicações

Manifesto Ágil: Os Prós e Contras das Métricas Diárias
Artigos
3 compartilhamentos34 visualizações
3 compartilhamentos34 visualizações
Como baixar todos os seus dados do LinkedIn
Dicas
2 visualizações
2 visualizações

Como baixar todos os seus dados do LinkedIn

Carlos L. A. da Silva - 21 de Março de 2018
Descubra como os usuários interagem com seu aplicativo
Artigos
21 visualizações
21 visualizações

Descubra como os usuários interagem com seu aplicativo

Carlos L. A. da Silva - 20 de Março de 2018
10 sites que podem substituir os programas do seu PC
Artigos
1 visualizações
1 visualizações

10 sites que podem substituir os programas do seu PC

Carlos L. A. da Silva - 19 de Março de 2018