Implementation Code for automatically displaying specified data without a value in the jQuery-based input box _ jquery

In your own webpage, you often need to specify the style input box, when the input box does not enter or only enter space and other invalid information, automatically display the specified text, to remind the user how to perform the operation, the following is the specific implementation method, for reference only. [Solution]

1. Preparations

(1) input box

The Code is as follows:

(2) CSS code

The Code is as follows:

Input. helpText {color: # aaa ;}

(3) Conversion Method

The Code is as follows:

Function switchText ()
{
If ($ (this). val () ==$ (this). attr ('title '))
$ (This). val (''). removeClass ('helptext ');
Else if ($. trim ($ (this). val () = '')
$ (This). addClass ('helptext'). val ($ (this). attr ('title '));
}

(4) specific implementation

The Code is as follows:

$ ('Input [type = text] [title! = ""] '). Each (function (){
If ($. trim ($ (this). val () = '') $ (this). val ($ (this). attr ('title '));
If ($ (this). val () ==$ (this). attr ('title') $ (this). addClass ('helptext ');
}). Focus (switchText). blur (switchText );

$ ('Form'). submit (function (){
$ (This). find ('input [type = text] [title! = ""] '). Each (function (){
If ($ (this). val () ==$ (this). attr ('title') $ (this). val ('');
});
});

2. References
Http://webservices.blog.gustavus.edu/2008/06/23/text-input-example-text-with-jquery/