I have two things i want to do to this input text field.
<input type="text" value="email@abc.com" name="Email" id="Email"
onblur="if (this.value == '') {this.value = 'email@abc.com';}"
onfocus="if (this.value == 'email@abc.com') {this.value = '';}" />
The initial value is set to “email@abc.com” but i want to change the text color to a grey only if they have not typed in the text field.
I also have the problem of different browsers having dropdown menues of words the user has typed in other input fields on other websites. how can i clear the list the browser generates?
Regarding auto-population, have a look at How do you disable browser Autocomplete on web form field / input tag?
With regards to a “watermark”, I would suggest (if you’re not opposed to jQuery) placeholder plugin (However I’m sure there are a lot of options if you google “placeholder”, “watermark” and “html” (or any combination thereof))
As an aside, I would keep the formatting in a set of
<script>tags and leave the markup on its own. Markup should be markup; javascript should supplement that separately and not in-line with the tags)