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 相关文章推荐
javascript parseInt() 函数的进制转换注意细节
Jan 08 Javascript
setInterval计时器不准的问题解决方法
May 08 Javascript
JS实现闪动的title消息提醒效果
Jun 20 Javascript
JavaScript设计模式之单件模式介绍
Dec 28 Javascript
javascript中数组的定义及使用实例
Jan 21 Javascript
Javascript中数组方法汇总(推荐)
Apr 01 Javascript
jQuery中 delegate使用的问题
Jul 03 Javascript
JavaScript小技巧整理篇(非常全)
Jan 26 Javascript
JavaScript Array对象详解
Mar 01 Javascript
JavaScript基础心法 深浅拷贝(浅拷贝和深拷贝)
Mar 05 Javascript
JavaScript中join()、splice()、slice()和split()函数用法示例
Aug 24 Javascript
JS中==、===你分清楚了吗
Mar 04 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
WordPress中is_singular()函数简介
2015/02/05 PHP
php支付宝在线支付接口开发教程
2016/09/19 PHP
php实现的AES加密类定义与用法示例
2018/01/29 PHP
学习YUI.Ext 第三天
2007/03/10 Javascript
js里的prototype使用示例
2010/11/19 Javascript
纯JS实现的批量图片预览加载功能
2011/08/14 Javascript
jquery tab插件精简版分享
2011/09/10 Javascript
js之事件冒泡和事件捕获详细介绍
2013/10/28 Javascript
图片上传插件jquery.uploadify详解
2013/11/15 Javascript
ie浏览器使用js导出网页到excel并打印
2014/03/11 Javascript
js全选按钮的实现方法
2015/11/17 Javascript
JavaScript表单焦点自动切换代码
2016/07/24 Javascript
详解Vue2.0之去掉组件click事件的native修饰
2017/04/20 Javascript
Angular 2父子组件数据传递之@Input和@Output详解(下)
2017/07/05 Javascript
通过命令行生成vue项目框架的方法
2017/07/12 Javascript
NodeJS实现视频转码的示例代码
2017/11/18 NodeJs
arcgis for js栅格图层叠加(Raster Layer)问题
2017/11/22 Javascript
JavaScript实现修改伪类样式
2017/11/27 Javascript
浅谈Vue Element中Select下拉框选取值的问题
2018/03/01 Javascript
深入理解JS的事件绑定、事件流模型
2018/05/13 Javascript
es6中比较有用的7个技巧小结
2019/07/12 Javascript
Antd下拉选择,自动匹配功能的实现
2020/10/24 Javascript
[06:49]2018DOTA2国际邀请赛寻真——VirtusPro傲视群雄
2018/08/12 DOTA
用pywin32实现windows模拟鼠标及键盘动作
2014/04/22 Python
python模块之StringIO使用示例
2015/04/08 Python
详解Python的Django框架中的Cookie相关处理
2015/07/22 Python
Python的“二维”字典 (two-dimension dictionary)定义与实现方法
2016/04/27 Python
详解Django配置优化方法
2019/11/18 Python
使用css3做0.5px的细线的示例代码
2018/01/18 HTML / CSS
HTML5 canvas标签实现刮刮卡效果
2015/04/24 HTML / CSS
区域销售经理职责
2013/12/22 职场文书
我的长生果教学反思
2014/04/28 职场文书
高中教师先进事迹材料
2014/08/22 职场文书
2015年打非治违工作总结
2015/04/02 职场文书
2015年城管个人工作总结
2015/05/15 职场文书
年终奖金发放管理制度,中小企业适用,拿去救急吧!
2019/07/12 职场文书