jquery表单验证插件validation使用方法详解


Posted in Javascript onJanuary 20, 2017

一、如何使用

引入js文件

<script src="jquery.js"></script>
<script src="jquery.validate-1.13.1.js"></script>

编写html页面,这里仅以用户名、密码为例

<body>
 <form id="demoForm">
  <fieldset>
   <legend>用户登录</legend>
   <p>
    <label for="username">用户名</label>
    <input type="text" id="username" name="username">
   </p>
   <p>
    <label for="password">密码</label>
    <input type="text" id="password" name="password">
   </p>
  </fieldset>
 </form>
</body>

编写script脚

$(document).ready(function(){
 $("#demoForm").validate({
  rules:{
   username:{
    required:true,// 是否必填
    minlength:2, // 最小长度
    maxlength:10 // 最大长度
   },
   password:{
    required:true,
    minlength:2,
    maxlength:16
   }
  }
 });
});

二、测试

jquery表单验证插件validation使用方法详解

如果大家还想深入学习,可以点击两个精彩的专题:jquery表单验证大全 JavaScript表单验证大全

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Prototype 工具函数 学习
Jul 23 Javascript
javascript下判断一个对象是否具有指定名称的属性的的代码
Jan 11 Javascript
jQuery1.5.1 animate方法源码阅读
Apr 05 Javascript
这段js代码得节约你多少时间
Dec 20 Javascript
js获取系统的根路径实现介绍
Sep 08 Javascript
JS实现判断滚动条滚到页面底部并执行事件的方法
Dec 18 Javascript
jQueryMobile之Helloworld与页面切换的方法
Feb 04 Javascript
webpack3+React 的配置全解
Aug 21 Javascript
IE9 elementUI文件上传的问题解决
Oct 17 Javascript
微信小程序map组件结合高德地图API实现wx.chooseLocation功能示例
Jan 23 Javascript
Vue 动态添加路由及生成菜单的方法示例
Jun 20 Javascript
解决vue安装less报错Failed to compile with 1 errors的问题
Oct 22 Javascript
jquery表单插件form使用方法详解
Jan 20 #Javascript
AngularJs上传前预览图片的实例代码
Jan 20 #Javascript
详解JavaScript中this的指向问题
Jan 20 #Javascript
详解微信小程序入门五: wxml文件引用、模版、生命周期
Jan 20 #Javascript
浅谈JavaScript异步编程
Jan 20 #Javascript
JavaScript实现事件的中断传播和行为阻止方法示例
Jan 20 #Javascript
小程序开发实战:实现九宫格界面的导航的代码实现
Jan 19 #Javascript
You might like
php zlib压缩和解压缩swf文件的代码
2008/12/30 PHP
用php实现的下载css文件中的图片的代码
2010/02/08 PHP
如何利用PHP执行.SQL文件
2013/07/05 PHP
PHP合并discuz用户脚本的方法
2015/08/04 PHP
PHP微信红包API接口
2015/12/05 PHP
PHP使用mysql与mysqli连接Mysql数据库用法示例
2016/07/07 PHP
php中的异常和错误浅析
2017/05/03 PHP
最佳6款用于移动网站开发的jQuery 图片滑块插件小结
2012/07/20 Javascript
javascript 系统文件夹文件操作及参数介绍
2013/01/08 Javascript
使用jQuery同时控制四张图片的伸缩实现代码
2013/04/19 Javascript
jQuery的attr与prop使用介绍
2013/10/10 Javascript
利用jq让你的div居中的好方法分享
2013/11/21 Javascript
Javascript变量作用域详解
2013/12/06 Javascript
Javascript 浮点运算精度问题分析与解决
2014/03/26 Javascript
教你如何使用firebug调试功能了解javascript闭包和this
2015/03/04 Javascript
javascript 将共享属性迁移到原型中去的实现方法
2016/08/31 Javascript
PHP获取当前页面完整URL的方法
2016/12/02 Javascript
深入理解javascript的getTime()方法
2017/02/16 Javascript
vue数组对象排序的实现代码
2018/06/20 Javascript
js笔试题-接收get请求参数
2019/06/15 Javascript
为nuxt项目写一个面包屑cli工具实现自动生成页面与面包屑配置
2019/09/29 Javascript
JS FormData对象使用方法实例详解
2020/02/12 Javascript
JSONP 的原理、理解 与 实例分析
2020/05/16 Javascript
浅谈js数组splice删除某个元素爬坑
2020/10/14 Javascript
[01:02:05]LGD vs Mineski 2018国际邀请赛小组赛BO2 第一场 8.19
2018/08/21 DOTA
Python实现对特定列表进行从小到大排序操作示例
2019/02/11 Python
通过实例解析Python return运行原理
2020/03/04 Python
Python代码注释规范代码实例解析
2020/08/14 Python
纽约复古灵感的现代珠宝品牌:Lulu Frost
2018/03/03 全球购物
AURALog面试题软件测试方面
2013/10/22 面试题
《我要的是葫芦》教学反思
2014/02/23 职场文书
硕士生工作推荐信
2014/03/07 职场文书
婚纱店策划方案
2014/05/22 职场文书
大学生团员个人总结
2015/02/14 职场文书
详解Laravel服务容器的优势
2021/05/29 PHP
vue实现省市区联动 element-china-area-data插件
2022/04/22 Vue.js