<input type="text" class="type-field" name="username" value="Username" onFocus="if (this.value=='Username') this.value='';" onBlur="if (this.value=='') this.value='Username';" />


well, I want to do onFocus and onBlur for the password field, but it would show stars instead of the text I want shown.

Is there away around this?

Then use the password input type, see http://htmlhelp.com/reference/html40/forms/input.html.

ugh, I did use the password input type.

What I am saying is that with type="password" I can't use OnFocus and OnBlur to say "Please Enter Password". I was asking if there is a way to put "Please Enter Password" without the text turning into stars.

I think the whole point of a "password" type is that it replaces the text by asterisks. So you want an input type that replaces the text by asterisks that doesn't replace the text by asterisks. That's logically difficult.

Why not simply write "Please enter password" above the input box, like everyone else does?

I was just wondering if there's a way to do it. It's the 21st century! I assume many things can be done. I just don't know if it can or can't, so I ask. Which is what I am doing here.

I don't think you can.

It's a bad idea to use the default value of a form field as the label for the form field. For one thing, the user must erase your label value before entering the real value. For another, once the user has done so, the label is gone, which makes it hard to review the form input to make sure it is correct.

Just use a label. If you want to get fancy, then put it in a label element:

While I agree with Darin, it seems you can change the TYPE attribute of the field with javascript. This works in Mozilla/Firefox, Safari/Win and Opera9, but IE7 doesn't support it.

Also there's the issue how the field should work if javascript is not used in the browser. If the field was TYPE=PASSWORD by default, the "Username" value would show up as asterisks. If OTOH the field was TYPE=TEXT the user wouldn't get any asterisks at all.

I agree both with Brian & Darin! I guess I am old fashioned, but I subscribe to the KISS principle. IMO all that jazz everyone after is counter productive at the bottom line.

As mentioned, you can toggle the input type from text to password using javascript.

You could use CSS to give the field a 'please enter password' background image and change it on focus.

You could use CCS to position the field label over the input field then set the field's z-index higher than its label on focus

You could clearly label each field and leave theie values empty.

Whichever solution you choose it is important to label your fields for accessibility (even if you then hide them in CSS).