LiveValidation验证

最新推荐文章于 2012-09-09 10:07:48 发布

wuming_zy

最新推荐文章于 2012-09-09 10:07:48 发布

阅读量146

点赞数

分类专栏： java 文章标签： livevalidation

本文链接：https://blog.csdn.net/wuming_zy/article/details/84003392

版权

java 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

1、[url]http://livevalidation.com/download[/url]下载livevalidation_standalone.js

2、目录结构：
WebRoot
javascript
livevalidation_standalone.js
registerform_validation.js

styles
validation.css
user
regist.jsp

3、jsp页面

<html>
       <head>
              <link href="styles/validation.css" rel="stylesheet" type="text/css" />
              <script type="text/javascript"                     src="javascript/livevalidation_standalone.js"></script>

       </head> 

       <body>
              <s:form action="register">
                     <table>
                            <tr>
                                   <td width="32%">
                                          User Name
                                          <font color="#FF0000">*</font>
                                   </td>
                                   <td>
                                          <s:textfield name="user.username" id="username" />
                                   </td>
                            </tr>
                            <tr>
                                   <td>
                                          Password
                                          <font color="#FF0000">*</font>
                                   </td>
                                   <td>
                                          <s:password name="user.password" id="password" />
                                   </td>
                            </tr>
                            <tr>
                                   <td>
                                          Confirm Password
                                          <font color="#FF0000">*</font>
                                   </td>
                                   <td>
                                          <s:password name="user.confirmpassword" id="repassword" />
                                   </td>
                            </tr>
                            <tr>
                                   <td>
                                          Telephone
                                   </td>
                                   <td>
                                          <s:textfield name="user.phone" id="phone" />
                                   </td>
                            </tr>
                            <tr>
                                   <td>
                                          Email
                                   </td>
                                   <td>
                                          <s:textfield name="user.email" id="email" />
                                   </td>
                            </tr>
                            <tr>
                                   <td>
                                          Address
                                   </td>
                                   <td>
                                          <s:textfield name="user.address" id="address" />
                                   </td>
                            </tr>
                            <tr>
                                   <td>
                                          Post Code
                                   </td>
                                   <td>
                                          <s:textfield name="user.postcode" id="postcode" />
                                   </td>
                            </tr>
                            <tr>
                                   <td align="center" colspan="2">
                                          <s:submit value="Submit" />
                                               
                                          <s:reset value=" Reset " />
                                   </td>
                            </tr>
                     </table>
              </s:form> 

              <script type="text/javascript" src="javascript/registerform_validation.js"></script>
       </body>
</html>

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);

wuming_zy

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
LiveValidation验证

1、[url]http://livevalidation.com/download[/url]下载livevalidation_standalone.js2、目录结构： WebRoot javascript livevalidation_standalone.js registerform_v...
复制链接

扫一扫

专栏目录