<%@ 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>

例子所需包

jquery中validate插件表单验证的更多相关文章

  1. jQuery Validate 插件[表单验证]

    在客户端添加信息提交表单时我们经常需要做一些验证,比如验证不能为空,验证客户输入手机格式,验证客户输入email,url等的格式,我们可以通过EL表达式结合js 进行自主验证,今天总结一个JQuery ...

  2. jQuery Validate 插件[表单验证 属性介绍]

    详细介绍一下Validate插件 $("#form的Id").validate({ }) 属性 规则 描述 required:true 必须输入的字段 required: &quo ...

  3. Jquery.validate.js表单验证插件的使用

    作为一个网站web开发人员,以前居然不知道还有表单验证这样好呀的插件,还在一行行写表单验证,真是后悔没能早点知道他们的存在. 最近公司不忙,自己学习一些东西的时候,发现了validation的一个实例 ...

  4. jQuery.validate.js表单验证插件

    jQuery.validate.js表单验证插件的使用 效果: 代码: <!DOCTYPE html> <html lang="en"> <head& ...

  5. 基于Jquery Validate 的表单验证

    基于Jquery Validate 的表单验证 jquery.validate.js是jquery下的一个验证插件,运用此插件我们可以很便捷的对表单元素进行格式验证. 在讲述基于Jquery Vali ...

  6. 异步提交form的时候利用jQuery validate实现表单验证

    异步提交form的时候利用jQuery validate实现表单验证相信很多人都用过jquery validate插件,非常好用,并且可以通过下面的语句来自定义验证规则    // 电话号码验证    ...

  7. 基于Bootstrap+jQuery.validate Form表单验证实践

    基于Bootstrap jQuery.validate Form表单验证实践 项目结构 :     github 上源码地址:https://github.com/starzou/front-end- ...

  8. vue validate多表单验证思考 之前写过一个里外层,现在觉得不合适,应该平行的写,然后都给ret,最后判断ret 再做出反应,这样整体表单的所有验证就都报验证,然后最后提交的时候把组件内的对象合并到总的对象,再提交

    vue validate多表单验证思考 之前写过一个里外层,现在觉得不合适,应该平行的写,然后都给ret,最后判断ret 再做出反应,这样整体表单的所有验证就都报验证,然后最后提交的时候把组件内的对象 ...

  9. 使用validate进行表单验证时土方法(appendTo)改变error显示的位置

    <span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255) ...

随机推荐

  1. 对拍BAT

    :loop makedata.exe K.exe Kture.exe fc a.out b.out if %errorlevel%==0 goto loop pause

  2. < meta > 元素(转)

    < meta > 元素 概要 标签提供关于HTML文档的元数据.元数据不会显示在页面上,但是对于机器是可读的.它可用于浏览器(如何显示内容或重新加载页面),搜索引擎(关键词),或其他 we ...

  3. Why AIXTHREAD_SCOPE Should Be Set To 'S' On AIX

    In a multi-processor environment running on an AIX platform, if you are intending to use multi-threa ...

  4. 移动端影像解决方案Adobe Creative SDK for ios

    移动端影像解决方案Adobe Creative SDK for ios 2015-12-20 分类:整理 阅读(390) 评论(0)  老牌影像界泰斗不甘落寞,正式推出了Adobe Creative ...

  5. C# 10 总复习

    数据类型--变量与常量--运算符与表达式--语句(if,for)--数组--函数--结构体 一.数据类型: (一)内建类型 整型(int short long byte uint ushort ulo ...

  6. [Linked List]Remove Duplicates from Sorted List

    Total Accepted: 90247 Total Submissions: 254602 Difficulty: Easy Given a sorted linked list, delete ...

  7. Oracle 11g R2安装手册(图文教程)For Windows

    1.Oracle 11g R2安装手册(图文教程)For Windows 1.下载Oracle 11g R2 for Windows版本,下载地址如下 官方网站: http://download.or ...

  8. Android - Ant自动编译打包android项目 -- 1(转)

    1.  背景: Eclipse用起来虽然方便,但是编译打包android项目还是比较慢,尤其当要将应用打包发布到各个渠道时,用Eclipse手动打包各种渠道包就有点不切实际了,这时候我们用到Ant帮我 ...

  9. 基于IAP和Keil MDK的远程升级设计

    写在前面:三个周之前,我突然想写一个远程升级的程序.那个时候我只是大概知道IAP的意思是在应用编程,但怎么编,我还一无所知.我给自己定下一个个阶段目标,从最基础的代码一点点写起,解决一个又一个的问题. ...

  10. 在esx上 docker的网络桥接

    docker:/root# docker run -itd --net=none --name zjtest8_haproxy 192.168.32.150:5000/zjzc_centos6.5_m ...