日期:2014-05-16  浏览次数:20364 次

jquery.validate.min.js 用法方法示例

页面html 代码


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>jquery.validate.min.js 用法方法示例</title>
    <script type="text/javascript" src="/js1/jquery-1.4a2.min.js"></script>
    <script src="../js1/base.js" type="text/javascript"></script>
    <script src="../js1/validate/jquery.validate.min.js" type="text/javascript"></script>
    <script src="../js1/validate/validatecode.js" type="text/javascript"></script>
  <style type="text/css">
    
      .span9{ width:245px; padding-right:10px; font-size:14px; color:#505050;line-height:33px; height:33px; display:inline-block; text-align:right;}
  .span9 b{ font-weight:normal; font-size:12px; position:relative; top:3px; color:#f00; right:5px;}
  .input1{ height:31px; width:230px; border:1px solid #DBDBDB; padding:0;}
  .input2{ width:340px;}
  .span10{line-height:33px; height:33px; color:#A7A7A7; padding-left:10px;}
  .div10 textarea{ padding:5px; width:330px; height:80px; resize:none;}
label.error
{
    display: inline-block;
    margin-left: 5px;
    padding: 5px 0 5px 20px;
    color: #F00;
    font-size: 12px;
    line-height: 12px;
    background: url(../images1/validate_bg.gif) 0 3px no-repeat;
    vertical-align: middle;
    color: Red;
    margin-top: 7px;
}
label.success
{
    background: url(../images1/validate_bg.gif) 0 -22px no-repeat;
    vertical-align: middle;
    margin-top: 7px;
}
.ipt_txt
{
    width: 150px;
    border: 1px solid #B1C3D9;
    background-color: #FBFBFB;
}
input.error
{
    background-color: #FBE2E2;
}


    </style>
</head>
<body>
    <form id="cerform" runat="server">
   <div>
                          <span class="span9"><b>*</b>用户真实姓名</span><input id="txtUserName" runat="server" class="input1 ipt_txt"
                                type="text" />
                                <span class="span10">请输入您的真实姓名</span></div>
                        <div class="clear height20">
                        </div>
                        <div>
                            <span class="span9"><b>*</b>身份证号码</span><input id="txtUserCardID" runat="server"
                                class="input1 input2 ipt_txt" type="text" /><span class="span10">请输入您的身份证号码</span></div>
                        <div class="clear height20">
                        </div>
                        <div>
                            <span class="span9"><b>*</b>认证说明</span><textarea id="txtAreaContent" runat="server"></textarea><span class="span10">请完善认证说明,成功认证后,将出现在您的认证说明介绍中</span></div>
                        <div class="clear height20">
                        </div>
                        <div>
                            <span class="span9"><b>*</b>联系邮箱</span><input id="txtEmail" class="input1