zoukankan      html  css  js  c++  java
  • jquery中validate插件表单验证

    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
    <%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
    %>
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <base href="<%=basePath%>">
        
        <title>My JSP 'index.jsp' starting page</title>
        <meta http-equiv="pragma" content="no-cache">
        <meta http-equiv="cache-control" content="no-cache">
        <meta http-equiv="expires" content="0">    
        <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
        <meta http-equiv="description" content="This is my page">
        <script type="text/javascript" src="<%=path%>/js/jquery.js" ></script>
        <script type="text/javascript" src="<%=path%>/js/jquery.validate.js"></script>
        <script type="text/javascript">
            var validator; 
            $(document).ready(function(){
                
                $.validator.addMethod("zip_code",function(value,element,parents){
                    var laijie =/^[0-9]{6}$/;
                    return this.optional(element)||(laijie.test(value));
                },$.validator.format("{0}"));
                
                $("#check").click(function(){
                    alert($("#validateform").valid()?"true":"false");
                });
                $.validator.setDefaults({
                    debug:true});
                validator = $("#validateform").validate({
                    rules:{
                        username:{
                            required:true,
                            rangelength:[2,10],
                            zip_code:"邮编格式"
                        },
                        passwd:{
                            required:true,
                            rangelength:[2,16]
                        },
                        confirmpasswd:{
                            required:true,
                            equalTo:"#passwd"
                        }
                    },
                    messages:{
                        username:{
                            required:"户名必填",
                            rangelength:"用户名介于{0}和{1}之间"
                        },
                        passwd:{
                            required:"密码为空",
                            rangelength:"密码介于{0}和{1}之间"
                        },
                        confirmpasswd:{
                            required:"确认密码为空",
                            equalTo:"密码不相同"
                        }
                    },
                    submitHandler:function(form){
                        //form.submit();
                        console.log($(form).serialize());
                    }
                });
            });
            
        </script>
      </head>
      
      <body>
          <form action="" method="post" id="validateform" name="validateform">
          <fieldset>
          <legend>登陆窗口</legend>
          邮编:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          <input type="text" id="username" name="username"/><br>
          密码:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          <input type="password" id="passwd" name="passwd"/><br>
          确认密码:
          <input type="password" id="confirmpasswd" name="confirmpasswd"/><br>
          <input type="button" id="check" name="check" value="检查">&nbsp;
        <input type="submit" id="send" value="注册" /><br>
        <div id = "resText"></div>
        </fieldset>
        </form>
      </body>
    </html>

    例子所需包

  • 相关阅读:
    Java实现 LeetCode 50 Pow(x,n)
    Java实现 LeetCode 50 Pow(x,n)
    Java实现 LeetCode 49 字母异位词分组
    Java实现 LeetCode 49 字母异位词分组
    Java实现 LeetCode 49 字母异位词分组
    Java实现 LeetCode 48 旋转图像
    Java实现 LeetCode 48 旋转图像
    Java实现 LeetCode 48 旋转图像
    Java实现 LeetCode 47 全排列 II(二)
    Java实现 LeetCode 47 全排列 II(二)
  • 原文地址:https://www.cnblogs.com/laijie/p/4735633.html
Copyright © 2011-2022 走看看