JQuery表单验证插件
使用jQuery的validate插件实现一个简单的表单验证
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title> </head>
<body style="margin: 50px;">
<form id="form1" action="#" method="get">
<table>
<tr>
<td>用户名</td>
<td><input type="text" name="username" id="username" /></td>
</tr>
<tr>
<td>密码</td>
<td><input type="password" name="password" id="password" /></td>
</tr>
<tr>
<td></td>
<td><input type="submit" value="提交" /></td>
</tr>
</table>
</form>
<!--引入JQ库-->
<script src="../js/jquery-3.3.1.js"></script>
<!--引入validate库-->
<script src="../js/jquery.validate.js"></script>
<script type="text/javascript">
$("#form1").validate({
rules:{
username:{
required:true
},
password:{
required:true,
minlength:4,
maxlength:6
}
},
messages:{
username:{
required:"用户名必填"
},
password:{
required:"密码不能为空",
minlength:"密码的最小长度为4",
maxlength:"密码的最大长度为6"
}
}
})
</script>
</body>
</html>
如果是radio或者checkbox，校验不通过时默认的提示信息在第一个radio后面，的解决方案：
//在radio标签前后面加上以下标签：注意，lable的for属性值要与radio的name属性值保持一致。
<label class="error" for="gender" style="display: none;"></label>
JQuery表单验证插件的更多相关文章
- 【jquery】Validform，一款不错的 jquery 表单验证插件
关于 Validform 这是一款很不错的 jquery 表单验证插件,它几乎能够满足任何验证需求,仅仅一行代码就能搞定整站的表单验证. $('form').Validform(); 为什么能如此方便 ...
- 【jQuery基础学习】06 jQuery表单验证插件-Validation
jQuery的基础部分前面都讲完了,那么就看插件了. 关于jQuery表单验证插件-Validation validation特点: 内置验证规则:拥有必填.数字.E-Mail.URL和信用卡号码等1 ...
- jQuery 表单验证插件 jQuery Validation Engine 使用
jQuery 表单验证插件 jQuery Validation Engine 使用方式如下: 1.引入头文件(注意一定要把jQuery放在前面),指定使用 jQuery Validation Engi ...
- jquery validate强大的jquery表单验证插件
jquery validate的官方演示和文档地址: 官方网站:http://jqueryvalidation.org/ 官方演示:http://jqueryvalidation.org/files/ ...
- 轻量级实用JQuery表单验证插件：validateForm5
表单验证是Web项目一个必不可少的环节,而且是一项重复的劳动,于是小菜封装了一款简单的表单验证插件,名字叫:validateForm5. validateForm5插件基于Jquery,并向HTML5 ...
- (转)强大的JQuery表单验证插件 FormValidator使用介绍
jQuery formValidator表单验证插件是客户端表单验证插件.在做B/S开发的时候,我们经常涉及到很多表单验证,例如新用户注册,填写个人资料,录入一些常规数据等等.在这之前,页面开发者(J ...
- 强大的JQuery表单验证插件 FormValidator使用介绍
jQuery formValidator表单验证插件是客户端表单验证插件. 在做B/S开发的时候,我们经常涉及到很多表单验证,例如新用户注册,填写个人资料,录入一些常规数据等等.在这之前,页面开发者( ...
- Jquery表单验证插件validate
写在前面: 在做一些添加功能的时候,表单的提交前的验证是必不可少的,jquery的validate插件就还可以,对于基本的需求已经够了.这里记录下基本的用法. 还是写个简单的demo吧 <htm ...
- jQuery 表单验证插件——Validation(基础)
这个插件不错,是用jquery写的.能进行表单验证.我喜欢它的原因是因为 1.他有自带的验证规则 2.你可以自己写验证规则 3.可以通过ajax与后台交互,与后台数据比较.最后返回结果!我在表单中要验 ...
随机推荐
- 第五章.MyBatis高级映射
5.1 新建数据库准备 CREATE TABLE `finacial_products` ( `product_id` ) NOT NULL AUTO_INCREMENT, `name` ) NO ...
- faster-rcnn anchor_target_layer、rpn_proposal_layer、proposal_target_layer
faster rcnn中这三层是单独生成的层,也是复现最复杂的层 anchor_target_layer作用:从众多的anchor中选取出正负样本供rpn网络学习(实际上就是把anchor和gt进行配 ...
- kettle maven 配置
<properties> <kettle.version>6.1.0.4-225</kettle.version> </properties> < ...
- [LuoguP3195] [HNOI2008]玩具装箱TOY
[HNOI2008]玩具装箱(Link) 题目描述 \(P\)教授要去看奥运,但是他舍不下他的玩具,于是他决定把所有的玩具运到北京.他使用自己的压缩器进行压缩,其可以将任意物品变成一堆,再放到一种特殊 ...
- maven下载依赖jar包失败处理方法－－下载jar包到本地并安装到maven仓库中
所有maven依赖jar包地址:https://repo1.maven.org/maven2/org/apache/ 1. 安装jar包失败报错: The following artifacts co ...
- C#中Lambda表达式类型Expression不接受lambda函数
在EF Core中我们经常会用System.Linq.Expressions系统命名空间的Expression<TDelegate>类型来作为EF Core的查询条件,比如: using ...
- jquery删除当前行
<tr><td><input type='hidden' name='annex' value="+rs+"><a href='javas ...
- mysql数据库迁移到oracle数据库后 如何删除相同的数据
mysql数据库迁移到oracle数据库后 如何删除相同的数据 首先搞清楚有多少数据是重复的 select pid from product group by pid having count(pid ...
- iOS7下Status Bar字体颜色修改
原文来自这里:iOS7下Status Bar字体颜色修改. 旧项目在iOS7上遇到status bar字体颜色需要修改的问题,症状如下:导航栏设置为黑色后,iphone上status bar的字体颜色 ...
- chromium之scoped_ptr
看看怎么使用 // Scopers help you manage ownership of a pointer, helping you easily manage the // a pointer ...