使用jQuery的validation插件实现表单校验
前端表单校验:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表单校验(使用validation插件实现)</title>
<script src="../jslib/jquery-1.11.0.js"></script>
<script src="../jslib/jquery.validate.js"></script>
<script src="../jslib/messages_zh.js"></script> <script>
$(function () {
$("#formid").validate({
rules:{
username:{
required:true
},
password:{
required:true,
rangelength:[6,10]
},
repassword:{
required:true,
equalTo:"[name='password']"
},
height:{
required:true,
min:[180]
},
age:{
required:true,
range:[18,56]
}
},
messages:{
username:{
required:"不能为空"
},
password:{
rangelenght:"密码长度必须在在6-10个字符之间"
},
height:{
min:"身高必须在180以上"
},
age:{
range:"年龄必须在在18岁到56岁之间"
}
}
});
});
</script>
</head>
<body>
<form id="formid" action="#"> <!--不能为空-->
用户名:<input type="text" name="username"/> <br/> <!--长度在6-10个字符之间-->
密码:<input type="text" name="password"/> <br /> 重复密码:<input type="text" name="repassword"/> <br /> <!--大于180cm-->
身高:<input type="text" name="height"/> <br /> <!--在18岁到56岁之间-->
年龄:<input type="text" name="age"/> <br /> 邮箱:<input type="text" name="email"/> <br /> <input type="submit" value="提交"/>
</form>
</body>
</html>
使用jQuery的validation插件实现表单校验的更多相关文章
- jQuery常用插件与jQuery使用validation插件实现表单验证实例
jQuery常用插件 1,jQuery特别容易扩展,开发者可以基于jQuery开发一些扩展动能 2,插件:http://plugins.jquery.com 3,超厉害的插件:validation . ...
- jQuery的validation插件(验证表单插件)
更完整的参考:http://www.runoob.com/jquery/jquery-plugin-validate.html 验证隐藏字段的使用(验证通过后ajax提交表单):http://www. ...
- 【JAVAWEB学习笔记】28_jqueryAjax:json数据结构、jquery的ajax操作和表单校验插件
Ajax-jqueryAjax 今天内容: 1.json数据结构(重点) 2.jquery的ajax操作(重点) 3.jquery的插件使用 一.json数据结构 1.什么是json JSON(J ...
- 【JAVAWEB学习笔记】28_jquery加强:json数据结构、jquery的ajax操作和表单校验插件
Ajax-jqueryAjax 今天内容: 1.json数据结构(重点) 2.jquery的ajax操作(重点) 3.jquery的插件使用 一.json数据结构 1.什么是json JSON(Jav ...
- 使用jquery.validate.js插件进行表单里控件的验证
jsp中具体实现的代码: <%@ page language="java" contentType="text/html; charset=UTF-8" ...
- JQuery插件使用之Validation 快速完成表单验证的几种方式
JQuery的Validation插件可以到http://plugins.jquery.com/上去下载.今天来分享一下,关于这个插件的使用. 简易使用 这第一种方式可谓是傻瓜式的使用,我们只需要按照 ...
- JQuery中内容操作函数、validation表单校验
JQuery:内容体拼接(可以直接拼接元素节点和内容节点) JQuery实现: 方案1:A.append(B); == B.appendTo(A);A的后面拼接B 方案2: A.prepend(B); ...
- jQuery Label Better – 友好的表单输入框提示插件
jQuery Label Better 帮助你标记您的表单输入域,带有美丽的动画效果而且不占用空间.这个插件的独特之处在于所有你需要做的就是添加一个占位符文本,只有当用户需要它的时候才显示标签. 您可 ...
- jquery.form.js+jquery.validation.js实现表单校验和提交
一.jquery引用 主要用到3个js: jquery.js jquery.form.js jquery.validation.js 另外,为了校验结果提示本地化,还需要引入jquery.vali ...
随机推荐
- 【css】—— inline-block 4px 和图片底部 2px bug
首先我们观察一组案例: HTML结构很简单: <!DOCTYPE html> <html lang="en"> <head> <meta ...
- [Swift]数组排序:sort和sorted
sorted只返回一个数组的有序版本,不修改原数组. sort无返回值,只会修改原数组. 定义一个需要排序的数组,其包含元素.示例只初始化一个Int数组. var arr:[Int] = [Int]( ...
- HTML5基础实例(三)
不知道从哪说起那就一段一段代码的说吧 实例一:iframe框架显示 写一个这样的网页: 分析: 1.需要三个链接,一个是默认的百度链接,默认显示在那个框里,另外:两个是点击跳转的超链接. 2.需要if ...
- Bootstrap Table使用方法详解
http://www.jb51.net/article/89573.htm bootstrap-table使用总结 bootstrap-table是在bootstrap-table的基础上写出来的,专 ...
- django在model中添加字段报错
在以下类中添加 description 字段后, class Colors(models.Model): colors = models.CharField(u'颜色', max_length=10) ...
- v-bind、v-on 的缩写
Vue中的缩写:v-bind.v-on v-bind 缩写:: 预期:any (with argument) | Object (without argument) 参数:attrOrProp (op ...
- 可以修改类不用重启Tomcat加载整个项目
修改类不重启Tomcat(不用手动重启) 修改tomcat conf目录下的server.xml <Context path="/struts2" docBase=&quo ...
- HDU - 6133 启发式合并
题意:给出一棵树共\(n\)个顶点,每个顶点有一个权值\(val_i\),你需要对每个节点统计一个最优解 每个节点的解按照一定规则产生:取出该节点的子树下所有的顶点,把顶点任意排序成一个序列,设为\( ...
- mongoengine在python中的使用
# /usr/bin/python # encoding: utf-8 # Author: masako from mongoengine import * host ='127.0.0.1' por ...
- fiddler安装和使用
App抓包原理 客户端向服务器发起HTTPS请求 抓包工具拦截客户端的请求,伪装成客户端向服务器进行请求 服务器向客户端(实际上是抓包工具)返回服务器的CA证书 抓包工具拦截服务器的响应,获取服务器证 ...