jquery插件validate验证的小例子


Posted in Javascript onMay 08, 2013
<!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>
    <title></title>
   <!-- 注意引用顺序-->
    <script src="Jquery1.7.js" type="text/javascript"></script>
    <script src="jquery.validate.js" type="text/javascript"></script>
    <script src="messages_cn.js" type="text/javascript"></script>
    <script type="text/javascript">
//        $(function () {
//            $('#a').validate({
//                rules: {
//                    username: { required: true, minlength: 6, maxlength: 12 },
//                    email: { required: true, email: true }
//                },
//                errorshow: function (error, element) {
//                    error.appendTo(element.siblings('span'));
//                }
//            })

        //        })
        $(function () {
            $('#a').validate({
                rules: {
                    username: { required: true, minlength: 6, maxlength: 12 },
                    email: { required: true, email: true },
                    pwd: { required: true, rangelength:[6,6] },
                    again: { required: true, equalTo: ($('#aa')) }, //这里一定是id 
                    birthday:{date:true},
                    blood:{digits:true}
                },
                errorshow: function (error, element) {
                    error.appendTo(element.siblings('span'));
                }
            })
        })
    </script>
</head>
<body>
<form  id="a">
<div>
用户名:<input type="text" name="username" /><span style="width:100px"></span>
<br />
邮箱:<input type="text" name="email" /><span style="width:100px"></span>
<br />
密码:<input type="text" name="pwd" /><span style="width:100px" id="aa"></span>
<br />
确认密码:<input type="text" name="again"  /><span style="width:100px"></span>
<br />
生日:<input type="text" name="birthday" /><span style="width:100px"></span>
<br />
血压:<input type="text" name="blood" /><span style="width:100px"></span>
</div>
</form>
</body>
</html>
Javascript 相关文章推荐
ie 调试javascript的工具
Apr 29 Javascript
JavaScript XML操作 封装类
Jul 01 Javascript
基于JavaScript实现轮播图代码
Jul 14 Javascript
js实现九宫格的随机颜色跳转
Feb 19 Javascript
js自定义Tab选项卡效果
Jun 05 Javascript
jQuery基于cookie实现换肤功能实例
Oct 14 jQuery
vue 实现全选全不选的示例代码
Mar 29 Javascript
浅谈Redux中间件的实践
Jul 27 Javascript
JS图片预加载三种实现方法解析
May 08 Javascript
JS实现单张或多张图片持续无缝滚动的示例代码
May 10 Javascript
vue中destroyed方法的使用说明
Jul 21 Javascript
vue+Element-ui实现分页效果
Nov 15 Javascript
jQuery ui插件的使用方法代码实例
May 08 #Javascript
js模拟select下拉菜单控件的代码
May 08 #Javascript
js工具方法弹出蒙版
May 08 #Javascript
基于JavaScript 声明全局变量的三种方式详解
May 07 #Javascript
你必须知道的JavaScript 变量命名规则详解
May 07 #Javascript
你必须知道的JavaScript 中字符串连接的性能的一些问题
May 07 #Javascript
基于JavaScript实现继承机制之构造函数方法对象冒充的使用详解
May 07 #Javascript
You might like
PHP 数字左侧自动补0
2008/03/31 PHP
浅析php中如何在有限的内存中读取大文件
2013/07/02 PHP
php使用Cookie实现和用户会话的方法
2015/01/21 PHP
php数字运算验证码的实现代码
2015/07/30 PHP
基于PHP-FPM进程池探秘
2017/10/17 PHP
提升你网站水平的jQuery插件集合推荐
2011/04/19 Javascript
easyui Draggable组件实现拖动效果
2015/08/19 Javascript
jQuery实现的网页换肤效果示例
2016/09/20 Javascript
完全深入学习Bootstrap表单
2016/11/28 Javascript
Bootstrap基本组件学习笔记之缩略图(13)
2016/12/08 Javascript
基于jQuery制作小图标上下滑动特效
2017/01/18 Javascript
js实现图片旋转 js滚动鼠标中间对图片放大缩小
2017/07/05 Javascript
MUI顶部选项卡的用法(tab-top-webview-main)详解
2017/10/08 Javascript
openlayers 3实现车辆轨迹回放
2020/09/24 Javascript
python网络编程学习笔记(六):Web客户端访问
2014/06/09 Python
Python入门篇之函数
2014/10/20 Python
用实例解释Python中的继承和多态的概念
2015/04/27 Python
详解Python中用于计算指数的exp()方法
2015/05/14 Python
Python中datetime常用时间处理方法
2015/06/15 Python
一篇文章入门Python生态系统(Python新手入门指导)
2015/12/11 Python
Python利用Beautiful Soup模块搜索内容详解
2017/03/29 Python
Python实现图片滑动式验证识别方法
2017/11/09 Python
Python实现控制台中的进度条功能代码
2017/12/22 Python
Python面向对象类继承和组合实例分析
2018/05/28 Python
Python二叉树的遍历操作示例【前序遍历,中序遍历,后序遍历,层序遍历】
2018/12/24 Python
对pyqt5中QTabWidget的相关操作详解
2019/06/21 Python
Python numpy数组转置与轴变换
2019/11/15 Python
Python安装与卸载流程详细步骤(图解)
2020/02/20 Python
python数据类型强制转换实例详解
2020/06/22 Python
澳洲女装时尚在线:Blue Bungalow
2018/05/05 全球购物
美国糖果店:Sugarfina
2019/02/21 全球购物
幸福家庭事迹材料
2014/02/03 职场文书
人力资源主管的岗位职责
2014/03/15 职场文书
放飞中国梦演讲稿
2014/04/23 职场文书
爱国教育主题班会
2015/08/14 职场文书
导游词之张家口
2019/12/13 职场文书