Como colocar só números no campo telefone e limitar caracteres na mensagem?
alguem pode ajudar?
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Solucionado
Como colocar só números no campo telefone e limitar caracteres na mensagem?
alguem pode ajudar?
Ei, Giuliano! Tudo bem?
Para delimitarmos apenas números no campo de telefone, podemos usar dentro da tag input o evento onekeypress. Ele permite chamar uma função quando o usuário pressiona uma tecla. O comando está escrito abaixo:
onkeypress="return event.charCode >= 48 && event.charCode <= 57"Dito isso, agora vamos entender cada uma das partes desse evento!
return finaliza a execução de uma função e especifica os valores que devem ser retornados para onde a função foi chamada.event.charCode >=48 e event.charCode<=57 obtém o valor da tecla do teclado pressionado, que neste caso representa o conjunto das teclas numéricas (0 a 9).&& é operador lógico and, que no português podemos traduzir como "e". Ele representa um conjunto lógico que precisa ser respeitado para que o valor retornado seja verdadeiro.Conhecendo cada uma das partes desse evento, podemos inferir que quando apenas as teclas numéricas forem pressionadas o valor será digitado no campo especificado.
O código completo está abaixo:
<label for="radio-telefone" class="texto">
<input type="tel" name=contato value="telefone" id="radio-telefone" onkeypress="return event.charCode >= 48 && event.charCode <= 57">Telefone</label>Já para limitar o uso de caracteres em um campo de preenchimento, podemos usar o atributo maxlenght que informa o número máximo de caracteres num campo de preenchimento dentro da tag <input> . O comando seria feito da seguinte maneira:
maxlenght="número máximo de caracteres"Por exemplo se quisermos que o número máximo de caracteres em um campo de mensagem seja de 200, o comando seria escrito assim:
maxlenght="200"O código completo está abaixo:
<label for="mensagem" class="bold">Mensagem</label>
<textarea cols="55" rows="10" id="mensagem" class="input-padrao" maxlength="200" required ></textarea>Caso tenha outras dúvidas, estou disponível para te auxiliar.
Abraços e bons estudos! :)