jquery.validate.js 表单验证简单用法
引入jquery.validate.js插件以及Jquery，在最后加上这个插件的方法名来引用。$('form').validate();
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jquery.validate.js的简单用法</title>
</head>
<body>
<form action="">
<p>用户名：<input class="required" type="text" minlength="3" name="user" />(*)</p>
<p>电子邮件：<input class="required email" type="text" name="email" />(*)</p>
<p>网址：<input class="url" type="text" name="url" /></p>
<p><input type="submit" value="提交" /></p>
</form>
</body>
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="jquery.validate.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('form').validate();
})
</script>
</html>
像以上class中的类名，required是字段不能为空；email是需要符合邮件格式；url是需要符合网址格式（必须带http://），后边minlength是需要输入最少字符,还有挺多参数，详情请看其文档。
二、当然以上是使用的控件方式去验证的，也可以使用JS 对象 键值对传参方式来设置：（上边表单里就不用再写class，直接用name来传值即可）
<form action="">
<p>用户名：<input name="user" />(*)</p>
<p>电子邮件：<input type="text" name="email" />(*)</p>
<p>网址：<input type="text" name="url" /></p>
<p><input type="submit" value="提交" /></p>
</form>
<script type="text/javascript">
$(document).ready(function(){
$('#reg').validate({
rules:{
user:{
required:true,
minlength:2,
},
email:{
email:true,
},
url:{
required:true;
}
},
messages:{
user:{
required:'账号不得为空',
minlength:'账号不得小于2位',
},
},
});
})
</script>
结合默认验证规则
此插件下载路径：链接: https://pan.baidu.com/s/1o8wcmkq 密码: grdp
二、如果你用了bootstrap框架，那么你可以用bootstrapValidator表单验证插件，更建议用这个哟~具体请查看：（链接转自）http://www.cnblogs.com/v-weiwang/p/4834672.html?ptvd
jquery.validate.js 表单验证简单用法的更多相关文章
- Jquery.validate.js表单验证插件的使用
作为一个网站web开发人员,以前居然不知道还有表单验证这样好呀的插件,还在一行行写表单验证,真是后悔没能早点知道他们的存在. 最近公司不忙,自己学习一些东西的时候,发现了validation的一个实例 ...
- jQuery.validate.js表单验证插件
jQuery.validate.js表单验证插件的使用 效果: 代码: <!DOCTYPE html> <html lang="en"> <head& ...
- jquery.validate.js表单验证 jquery.validate.js的用法
jquery.validate.js这个插件已经用了2年多了,是一个不可多得的表单验证最方便快捷的插件.基于jquery的小插件,基本小白一学就会上手,对于项目表单页面比较多,元素比较多的校验,该插件 ...
- jquery validate.js表单验证的基本用法入门
这里转载一篇前辈写的文章,在我自己的理解上修改了一下,仅作记录. 先贴一个国内某大公司的代码: 复制代码 代码如下: <script type="text/javascript&quo ...
- jquery.validate.js表单验证
一.用前必备官方网站:http://bassistance.de/jquery-plugins/jquery-plugin-validation/ API: http://jquery.bassist ...
- 【转】jquery.validate.js表单验证
一.用前必备官方网站:http://bassistance.de/jquery-plugins/jquery-plugin-validation/ API: http://jquery.bassist ...
- [转]jquery.validate.js表单验证
原文地址:https://www.cnblogs.com/si-shaohua/p/3780321.html 一.用前必备官方网站:http://bassistance.de/jquery-plugi ...
- 表单验证代码实例:jquery.validate.js表单验证插件
jquery.validate.js是JQuery旗下的一个验证插件,借助JQuery的优势,我们可以迅速验证一些常见的输入,并且可以自己扩充自己的验证方法.使用前请先下载必要的JQuery插件:jq ...
- 转：jquery validate.js表单验证
这里转载一篇前辈写的文章,在我自己的理解上修改了一下,仅作记录. 先贴一个国内某大公司的代码: 复制代码代码如下: <script type="text/javascript" ...
随机推荐
- Jquery 下实现 图片大图预览效果
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...
- Python基础之条件和循环
阅读目录 一.if语句 1.1功能 1.2语法 1.2.1:单分支,单重条件判断 1.2.2:单分支,多重条件判断 1.2.3:if + else 1.2.4:多分支if + elif +else 1 ...
- Topcoder SRM 683 Div2 B
贪心的题,从左向右推过去即可 #include <vector> #include <list> #include <map> #include <set&g ...
- 有向图的强连通分量的求解算法Tarjan
Tarjan算法 Tarjan算法是基于dfs算法,每一个强连通分量为搜索树中的一颗子树.搜索时,把当前搜索树中的未处理的结点加入一个栈中,回溯时可以判断栈顶到栈中的结点是不是在同一个强连通分量中.当 ...
- HTML 5 视频
HTML 5 视频 ======================================================================================= 如今 ...
- modprobe和lsmod命令配合使用
modprobe命令用于智能地向内核中加载模块或者从内核中移除模块. modprobe可载入指定的个别模块,或是载入一组相依的模块.modprobe会根据depmod所产生的相依关系,决定要载入哪些模 ...
- Excel图表的基本类型与选择
图表类型分成4大类:1. 比较 2. 分布 3. 构成 4. 联系 转载自:https://zhuanlan.zhihu.com/peter-zhang-jie
- Mifare系列5-存储结构（转）
文/闫鑫原创转载请注明出处http://blog.csdn.net/yxstars/article/details/38081521 Mifare S50把1K字节的容量分为16个扇区(Sector0 ...
- oracle过滤字母
select regexp_replace(col,'[A-Za-z]') from dual; --> 12345col 列名
- 深入理解BFC和外边距合并(Margin Collapse)
一.什么是BFC? 1.BFC的概念 BFC全称Block Formatting Context ,直译“块级格式化上下文”,也有译作“块级格式化范围”.它是 W3C CSS 2.1 规范中的一个概念 ...