Question

I’ve create a RSS submission form and I want to show in the input box something like Enter your email here...., and when they click on it that message should be disappear and they can put their email in the box.

Here is the code I’m using at the moment

<div id="RSS">
        <form action="http://feedburner.google.com/fb/a/mailverify" class="RSS" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=RSS', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
            <input type="hidden" name="uri" value="RSS">
            <input type="hidden" name="loc" value="en_US">
            <input name="email" id="RSS-text" type="text" maxlength="100" style="width:160px !important" value="Enter your email address..." class=""><button type="submit" id="RSS-button">Subscribe</button>
        </form>
    </div>

The problem is that it doesn’t disappear when someone click on it, and I saw many forms including my search form it can be done that way.

Answer 1

You can use the placeholder attribute, but it doesn’t support IE:

<input type="text" placeholder="Enter your text here..." />

Otherwise you can use a bit of javascript:

<input type="text" onfocus="if(this.value=='Enter your text here...') this.value='';" onblur="if(this.value=='') this.value='Enter your text here...';" value="Enter your text here..." />