A jQuery-based registry ticket with Tooltip form verification, jquerytooltip

A jQuery-based registry ticket with Tooltip form verification, jquerytooltip

Today, we will share with you a jQuery-based registry form. This form will automatically verify the information filled in when you confirm that you submit the registration information. If the information filled in is incorrect, the error message is displayed in a Tooltip prompt box in the corresponding field. This jQuery form is easy to implement and relatively lightweight to use.

Download Online Preview source code

This plug-in js references the jquery. js library and an easyform. js library.

The html code is as follows:

<Div class = "form-div"> <form id = "reg-form" action = "" method = "post"> <table> <tr> <td> User Name </td> <input name = "uid" type = "text" id = "uid" easyform = "length: 4-16; char-normal; real-time; "message =" the username must be 4-16 English letters or numbers "easytip =" disappear: lost-focus; theme: blue; "ajax-message =" the user name already exists! "> </Td> </tr> <td> password </td> <input name =" psw1 "type =" password "id =" psw1 "easyform =" length: 6-16; "message =" the password must be 6-16 characters "easytip =" disappear: lost-focus; theme: blue; "> </td> </tr> <td> Confirm password </td> <input name =" psw2 "type =" password "id =" psw2 "easyform =" length: 6-16; equal: # psw1; "message =" the two passwords must be consistent. "easytip =" disappear: lost-focus; theme: blue; "> </td> </tr> <td> email </td> <input Name = "email" type = "text" id = "email" easyform = "email; real-time;" message = "correct Email format" easytip = "disappear: lost-focus; theme: blue; "ajax-message =" this Email address has been registered. Please change it! "> </Td> </tr> <td> nickname </td> <input name =" nickname "type =" text "id =" nickname "easyform =" length: 2-16 "message =" the nickname must be 2-16 characters "easytip =" disappear: lost-focus; theme: blue; "> </td> </tr> </table> <div class =" buttons "> <input value =" "type =" submit "style =" margin- right: 20px; margin-top: 20px; "> <input value =" I have an account. I want to log on to "type =" button "style =" margin-right: 45px; margin-top: 20px; "> </div> <br class =" clear "> </form> </div> <script type =" text/javascript ">$ (document ). ready (function () {$ ('# reg-form '). easyform () ;}); </script>

Via: http://www.w2bc.com/Article/13972