Question

I have no idea on what terms I should look for in this site nor in google, pardon me if my question has a duplicate topics on it. Really don’t know what to type.

I’ll provide screenshots let you understand my problem.

Here is my textbox that has (optional) value on it.

When I focused my cursor on it, the textbox will be on focus mode (it didn’t changed the value of (optional) when I clicked on it..

When I typed something on textbox the (optional) value disappears and it shows the things that you’re typing.

When I [<-Backspace] the hello and remove it completely, the output I desire is the (optional) will go back to the way it was.

So long story short, I have this textbox that has a default value of (optional) when I typed on it, it will disappear and will show the things that you’re typing, and when I delete all of it, the (optional) will come back.

I just don’t have any slightest idea on how to start off. Would be glad if you help me guys.

Answer 1

There is now a standard HTML attribute : placeholder.

<input name=somename placeholder="(optional)">

It’s not yet universally supported but in my opinion this is the way to go, even if some users won’t see it until they upgrade their IE9 browser, because it will make your page much simpler and cleaner.