[HTML] Texto padrão no campo de texto

Livros
1

Oi, eu estou tentando fazer um campo de texto em html, mas queria que já tivesse algum valor nele que sumisse caso o usuário resolve-se preencher o campo. Até agora eu só soube colocar:

<input type="text"></input>

Alguma luz, por favor?

2

Opa @jean.pontes, essa é fácil, está lá no livro de HTML5 e CSS do Lucas Mazza :wink:

É só usar o atributo placeholder no seu input. Vai ficar algo como:

<input type="text" name="cpf" placeholder="999.999.999-99" />

Só isso. Fácil, né?

2 curtidas
3

@adrianoalmeida7 e @jean.pontes

Depende da sua intenção, tem três soluções diferentes e cada uma adequada ao seu caso:

  • Você quer um texto de exemplo que não será enviado no formulário, está lá só pra mostrar pro usuário como ele deve preencher o campo.
    Nesse caso, o ideal é usar o atributo placeholder, como dito pelo Adriano. Exemplo:
<input type="text" name="cidade" placeholder="São Paulo" />
  • Você quer um valor padrão que será enviado no formulário.
    Aí o ideal é usar o atributo value, pois este é efetivamente o valor inserido no campo e poderá ser editado pelo usuário. Exemplo:
<input type="text" name="cidade" value="São Paulo" />
  • Se você quer que o campo venha preenchido com um valor padrão mas, ao clique do usuário, este valor suma, você precisa usar a função javascript onFocus, mas o código pode ser feito inline e é bem tranquilo. Exemplo:
<input type="text" name="cidade" value="São Paulo" onFocus="value=null"/>

Nesse último caso, porém, é importante notar que SEMPRE que o usuário interagir com esse campo, o conteúdo será apagado.

1 curtida
4 
<input type="text"  name="nome" value="escreva seu nome feio aqui">