HTML input field hint

Question

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 fiel

Answer 1

With HTML5, you can now use the placeholder attribute like this:

<form action="demo_form.asp">
  <input type="text" name="fname" placeholder="First name"><br>
  <input type="text" name="lname" placeholder="Last name"><br>
  <input type="submit" value="Submit">
</form> 

http://www.w3schools.com/tags/att_input_placeholder.asp

Answer 2

This is exactly what you want

$(document).tooltip({ selector: "[title]",
                              placement: "top",
                              trigger: "focus",
                              animation: false}); 

<form id="form">
    <label for="myinput1">Browser tooltip appears on hover but disappears on clicking the input field. But this one persists while user is typing within the field</label>
    <input id="myinput1" type="text" title="This tooltip persists" />
    <input id="myinput2" type="text" title="This one also" />
</form>

[ref]

Answer 3

Define tooltip text

<input type="text" id="firstname" name="firstname" tooltipText="Type in your firstname in this box"> 

Initialize and configure the script

<script type="text/javascript">
var tooltipObj = new DHTMLgoodies_formTooltip();
tooltipObj.setTooltipPosition('right');
tooltipObj.setPageBgColor('#EEE');
tooltipObj.setCloseMessage('Exit');
tooltipObj.initFormFieldTooltip();
</script>