I want to provide the user with a hint on what he needs to enter into my text field. However, when I set the value, it does not disappear once a user clicks on the text field. How can you make it disappear?
<form action="input_password.htm"> <p>Username:<br><input name="Username" value="Enter username.." type="text" size="20" maxlength="20"></p> </form>
If you want to set a hint for text area or input field, then use the HTML placeholder attribute. The hint is the expected value, which gets displayed before the user enters a value, for example, name, details, etc.
The placeholder attribute specifies a short hint that describes the expected value of an input field (e.g. a sample value or a short description of the expected format). The short hint is displayed in the input field before the user enters a value.
The placeholder attribute specifies a short hint that describes the expected value of a input field / textarea. The short hint is displayed in the field before the user enters a value.
With a bit of JavaScript:
<input value="Enter username..." onfocus="if (this.value === 'Enter username...') this.value=''" ... />
HTML5 has a nice attribute for this, called placeholder
:
<input placeholder="Enter username.." ... />
but this attribute is not supported in old browsers.
You'd need attach an onFocus
event to the input field via Javascript:
<input type="text" onfocus="this.value=''" value="..." ... />
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With