Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do I make a HTML input box default text remove AFTER starting to type

Tags:

Say I have an input box with default text "name" in it. I would like for the user to click the box, the text stays in the box until the user starts to type.

I am not looking for code to clear the input box after focusing it.

Thanks!

like image 635
Jordan Clifton Avatar asked Sep 14 '12 01:09

Jordan Clifton


People also ask

How can you specify default text in an input field?

The value attribute specifies the value of an <input> element. The value attribute is used differently for different input types: For "button", "reset", and "submit" - it defines the text on the button. For "text", "password", and "hidden" - it defines the initial (default) value of the input field.

How do you prevent a user from typing in an input field?

The disabled attribute can be set to keep a user from using the <input> element until some other condition has been met (like selecting a checkbox, etc.). Then, a JavaScript could remove the disabled value, and make the <input> element usable.


2 Answers

It's placeholder attribute

<input type="text" placeholder="Type your name">
like image 98
alexndm Avatar answered Oct 14 '22 05:10

alexndm


What you are trying to do depends on the version of the browser you are targeting. If the customer uses a browser that support html5 then the answer from @alexndm will work. However if you are targeting a mass audience with number of browser version.

This article here will show how to do it the old way, i.e. using javascript. How do I get placeholder text in firefox and other browsers that don't support the html5 tag option?

Note: the OP of the post I linked also have html5 in case you need it.

like image 26
Steven Avatar answered Oct 14 '22 05:10

Steven