zoukankan      html  css  js  c++  java
  • jquery验证框架

    需要导入jquery.validate.js

    js:

    $("#a_usr_s03Form").validate({
            errorClass : "invalid",
            success : "valid",
            errorPlacement : function(error, element) {
                error.appendTo(element.parent("td").next("td"));
            },
            rules : {
                idUser : {
                    required : true,
                    maxlength : 12
                },
                userName : {
                    required : true,
                    maxlength : 30
                },
                password : {
                    required : true,
                    maxlength : 15
                },
                rekeyPassword : {
                    required : true,
                    equalTo : "#password"
                }
            },
            messages : {
                idUser : {
                    required : $("#idUserRequiredMsg").val(),
                    maxlength : $("#idUserMaxLengthMsg").val()
                },
                userName : {
                    required : $("#userNameRequiredMsg").val(),
                    maxlength : $("#userNameMaxLengthMsg").val()
                },
                password : {
                    required : $("#passwordRequiredMsg").val(),
                    maxlength : $("#passwordMaxLengthMsg").val()
                },
                rekeyPassword : {
                    required : $("#re-keyRequiredMsg").val(),
                    equalTo : $("#re-keyIncorrectMsg").val()
                }
            }
        });

    css样式:

    label.invalid {     background: url("http://www.cnblogs.com/image/error.png") no-repeat 0px 0px;     padding-left: 16px;     color: red; }

    label.valid {     background: url("http://www.cnblogs.com/image/correct.png") no-repeat 0px 0px;     height: 15px; }

    jsp界面:

    <td class="tdRight" width="17%"><span class="red_star"><bean:message key="screen.common.label_star" /> </span>
                                <bean:message key="screen.a_usr_s02.userid" />
                            </td>
                            <td align="left" width="25%"><input type="text" id="idUser" class="disabled" name="idUser" maxlength="13" style=" 90%;"
                                value="<bean:write name="a_usr_s03Form" property="idUser"/>" />
                            </td>
                            <td align="left" width="22%" nowrap="nowrap">&nbsp;</td> //显示提示信息

  • 相关阅读:
    软工1816 · 作业(十一)事后诸葛亮
    软工1816·Alpha冲刺(10/10)
    软工1816 · Alpha冲刺(9/10)
    软工1816 · Alpha冲刺(8/10)
    软工1816 · Alpha冲刺(7/10)
    软工1816 · Alpha冲刺(6/10)
    软工1816 · Alpha冲刺(5/10)
    软工1816 · 作业(九)团队现场编程实战
    团队项目评测
    Beta冲刺前准备
  • 原文地址:https://www.cnblogs.com/chengfang/p/jquery_validate.html
Copyright © 2011-2022 走看看