jQuery Autoclear

A simple plugin to clear input text fields on focus, and manage default values.

Setup

• Load latest jQuery library
• Load jquery-autoclear.min.js
• Enable AutoClear on your input and textarea fields:

$('.autoclear').autoClear();

• Set default values for those fields. This is done via the title and value attributes. Those must be identical; this is how the plugin determines if the value has changed from the default value.

  <input class="autoclear" id="name" title="Your Name" type="text" value="Your Name" />

Styling

The plugin adds two classes to your elements wether they are focused or modified by user :

On focus, a .focus_input class will be added to the field. When the user leaves the field, the .focus_input is removed and the script checks if the value has changed from the default value. If it has changed, a .modified_input class is added. Else, no extra class is added (default style).