Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New Coder
    Join Date
    Jul 2009
    Posts
    72
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Remove help text in form field on click?!

    I'm trying to figure out how to both make the text grey and when a user clicks inside a input field remove the helptext.

    So far I got this:
    Code:
    <input onfocus="this.select()" onblur="this.value=!this.value?'E-mail here':this.value;" name="name" value="E-mail here" type="text">
    What this does is allmost correct, but it doesnt remove the predefined text "E-mail here", it just select it all, and then the text is not grey...

    Can somebody please guide me in the right direction...

    Thanks in advance!

  • #2
    Senior Coder jmrker's Avatar
    Join Date
    Aug 2006
    Location
    FL
    Posts
    3,148
    Thanks
    39
    Thanked 506 Times in 500 Posts

    Lightbulb

    Without the rest of your code to view the problem in action,
    you might try this:
    Code:
    <input onfocus="this.select()" onblur="this.value=!this.value?'':this.value;"
     name="name" value="" type="text">

  • #3
    Regular Coder Amphiluke's Avatar
    Join Date
    Jul 2009
    Posts
    312
    Thanks
    3
    Thanked 89 Times in 89 Posts
    Maybe this will help you.
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
       <meta http-equiv="content-type" content="text/html;charset=utf-8" />
       <title>Template</title>
       <script type="text/javascript">
          function focusMe(sender) {
             if (sender.value == sender.defaultValue) {
                sender.value = "";
                sender.style.color = "#000000";
             }
          }
          function blurMe(sender) {
             if (sender.value == "") {
                sender.value = sender.defaultValue;
                sender.style.color = "#C0C0C0";
             }
          }
       </script>
    </head>
    <body>
       <p><input type="text" style="color: #C0C0C0;" value="E-mail here" onfocus="focusMe(this);" onblur="blurMe(this);" /></p>
    </body>
    </html>
    P.S. jmrker was faster.
    I am still learning English

  • #4
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,313
    Thanks
    203
    Thanked 2,564 Times in 2,542 Posts
    Try this:-

    <input type = "text" name = "email" id = "email" value = "E-mail here:-"; style=color:'#848484';
    onclick = "if (this.value == 'E-mail here:-') {this.value = '';this.style.color='#000000'}"
    onblur = "if (this.value == '') {this.value = 'E-Mail here:-';this.style.color='#848484'}" >

    He who posts last thinks slowest!
    Last edited by Philip M; 08-17-2009 at 09:58 PM.

  • #5
    New Coder
    Join Date
    Jul 2009
    Posts
    72
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Philip M View Post
    Try this:-

    <input type = "text" name = "email" id = "email" value = "E-mail here:-"; style=color:'#848484';
    onclick = "if (this.value == 'E-mail here:-') {this.value = '';this.style.color='#000000'}"
    onblur = "if (this.value == '') {this.value = 'E-Mail here:-';this.style.color='#848484'}" >

    He who posts last thinks slowest!
    Thanks man... Did the job ;-)


  •  

    Posting Permissions

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