3
respostas

Qual a importância do value="XXX" dentro do <input>?

De início achei que servia para informar ao browser que tipo de dado ele deveria aceitar. Ex: Nos input's do tipo "radio", o iput com value="telefone" só aceitaria números. Mas já vi que não é o caso Afinal para quê ele serve dentro de nosso input?

3 respostas

boa noite, os inputs que só aceitam números são type="number"

pelo que me lembro os type="tel" (eu ouvi dizer) em alguns países o telefone tem letras mas nao sei se é verdade.

isso serve mais para celular, quando você acessa um site pelo celular, em um input type tel, o teclado do seu celular mostra apenas os números e grandes. Se fosse type text ele mostraria o teclado com letras normal. Perceba nessa imagem o teclado numério fica grande por causa do input type tel, isso facilita a vida de quem usa celular. Insira aqui a descrição dessa imagem para ajudar na acessibilidade

oi, se eu entendi bem a pergunta, na aula Dados importantes nos inputs, o instrutor diz que é apenas um exemplo de como deverá ser o número de telefone digitado. DD+ nove números

+- no minuto 4 da vídeo-aula.

a sim ele coloca um placeholder para dar apenas um exemplo de como o usuário deve colocar o telefone.

tipo se você trabalha em uma empresa de são paulo e presta serviço para todo o país, o ddd é importante para poder telefonar para o usuário/cliente independente do estado em que ele está morando.

se o usuário não souber direito quais dados colocar ai a empresa pode não ligar para ele por falta de ddd por exemplo

eu fiz um código com script para você testar ai no seu computador é có copiar e colar no seu editor de código Você pode copiar e colar tudo no html mesmo apenas para testar

<input type="tel" name="telefone" id="telefone" maxlength="15" placeholder="(11) 91234-5678"
        onkeypress="mascara(this)">
    <style>
        body {
            height: 100vh;
            display: flex;
            justify-content: center;
            align-items: center;
        }
    </style>
    <script>
        function mascara(numeroDigitado) {
            if (numeroDigitado.value.length == 0)
                numeroDigitado.value = '(' + numeroDigitado.value; //quando digitar, irá inserir um parênteses no começo do campo.
            if (numeroDigitado.value.length == 3)
                numeroDigitado.value = numeroDigitado.value + ') '; //quandojá tiver 3 caracteres (um parênteses e 2 números)irá inserir um parênteses, fechando o código de área.

            if (numeroDigitado.value.length == 10)
                numeroDigitado.value = numeroDigitado.value + '-'; //quandojá tiver 10 caracteres, irá inserir um hífen para melhor visualização. Lembrando que parenteses e espaço também são caracteres.
        }
    </script>

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software