Welcome to WebmasterWorld Guest from 54.146.221.231

Forum Moderators: open

Message Too Old, No Replies

Form values that disappear on click

     
5:28 am on Aug 10, 2012 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Apr 21, 2002
posts: 1541
votes: 0


You know those search forms that have something like "Enter your text here" as an initial value in them, then you click in the field, and the text disappears.
How is that done? I assume it's java, but I guess it could be css. Either way, how do you do it?
11:37 am on Aug 10, 2012 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Nov 3, 2005
posts:1585
votes: 0


see [webmasterworld.com...] for JavaScript solution ( java is something completely different ). Not aware of css solution.
2:21 pm on Aug 10, 2012 (gmt 0)

Junior Member

5+ Year Member

joined:Aug 17, 2010
posts: 186
votes: 2


Try this.

<input type="text" onblur="if (this.value=='') { this.value='Please enter your text'; }" onfocus="if (this.value=='Please enter your text') { this.value=''; }" value="Please enter your text" id="search" name="search">
3:18 pm on Aug 10, 2012 (gmt 0)

Senior Member from US 

WebmasterWorld Senior Member fotiman is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:Oct 17, 2005
posts: 4966
votes: 10


HTML5 has added a "placeholder" attribute, so you don't need any scripting for this at all.
[diveintohtml5.info...]

Internet Explorer 9 or earlier doesn't support this, so you'd still need a JavaScript solution for those cases.