SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Member
    Join Date
    Jun 2005
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Form Input text disappear on click and reappear if nothing has been entered

    Hi there,

    I believe this would be a javascript piece of code.

    Basically i need help with input fields that when clicked the text (value) disappears but if the user has not entered anything in it would revert back to what was originally there.

    I have managed to get the value inside to disappear once clicked without the use of javascript but would love someone to point me in the right direction of how to revert the original value back if nothing was entered in if the user did click inside as the field continues to be blank which i know is minimal but it something small that is annoying me

    Heres what i have got at the moment...

    Code:
    			<input onfocus="if(this.value == 'Name'){this.value = '';}" type="text" id="name" value="Name" />		 
    			<input onfocus="if(this.value == 'Email'){this.value = '';}" type="text" id="email" value="Email">
    			<textarea name="message" onfocus="if(this.value == 'Message'){this.value = '';}" class="textarea">Message</textarea>
    			<button type="submit" class="button">Submit</button>

  2. #2
    Utopia, Inc. silver trophy
    ScallioXTX's Avatar
    Join Date
    Aug 2008
    Location
    The Netherlands
    Posts
    9,031
    Mentioned
    152 Post(s)
    Tagged
    2 Thread(s)
    You need onblur for that

    Code:
    <input onfocus="if(this.value == 'Name'){this.value = '';}" type="text" onblur="if(this.value == ''){this.value='Name';}" id="name" value="Name" />
    I think you can figure the other fields out for yourself

  3. #3
    SitePoint Member
    Join Date
    Jun 2005
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That simple ScallioXTX, your a legend and i feel like a idiot lol

    much appreciated for your quick reply


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •