LiveValidation验证

1、 下载livevalidation_standalone.js

 

2、目录结构：

       WebRoot

              javascript

                     livevalidation_standalone.js

registerform_validation.js

styles

       validation.css

              user

                     regist.jsp

3、jsp页面

 

      

             

             

      

 

      

             

                    

                           

                                  

                                  

                           

                           

                                  

                                  

                           

                           

                                  

                                  

                           

                           

                                  

                                  

                           

                           

                                  

                                  

                           

                           

                                  

                                  

                           

                           

                                  

                                  

                           

                           

                                  

                           

                    

User Name                                           *	id="username" />
Password                                           *	id="password" />
Confirm Password                                           *	id="repassword" />
Telephone	id="phone" />
Email	id="email" />
Address	id="address" />
Post Code	id="postcode" />

             

 

             

      

 

4、validation.css内容

.LV_validation_message{

       font-size: x-small;

    font-weight:bold;

    margin:0 0 0 5px;

}

 

.LV_valid {

    color:#00CC00;

}

      

.LV_invalid {

    color:#CC0000;

}

   

.LV_valid_field,

input.LV_valid_field:hover,

input.LV_valid_field:active,

textarea.LV_valid_field:hover,

textarea.LV_valid_field:active {

    border: 1px solid #00CC00;

}

   

.LV_invalid_field,

input.LV_invalid_field:hover,

input.LV_invalid_field:active,

textarea.LV_invalid_field:hover,

textarea.LV_invalid_field:active {

    border: 1px solid #CC0000;

}

 

4、registerform_validation.js内容

var username = new LiveValidation('username');

username.add(Validate.Presence);

 

var password = new LiveValidation('password');

password.add(Validate.Presence);

 

var repassword = new LiveValidation('repassword');

repassword.add(Validate.Presence);

repassword.add(Validate.Confirmation, {match: 'password'});

 

var email = new LiveValidation('email');

email.add(Validate.Email);