JavaScript之jQuery-7 jQuery 使用插件(使用插件、日历插件、表单验证插件)

一、jQuery 使用插件

插件的查找与帮助

- jQuery 官方网站的插件库(http://plugins.jquery.com)

提供了大量的插件。并给出去了每个插件的用户评级、版本及bug等

- 库中列出了每个插件的ZIP文件下载、演示、示例代码及教程

使用插件

- step 1:将插件包导入到页面中,并确保它在jQuery源文件之后

<script src="jqeury-1.11.1.js"></script>

<script></script>

- step 2:在页面中编写或导入自定义的script文件,并在其中使用插件创建或扩展的方法

$("#myID").plugins();

二、日历插件

日历插件

- 日历控件是web页面中比较常用的控件之一,HTML5中也添加了日历控件的支持

- 除了 HTML5 之外好多jQuery插件也有与日历空间相关的,比如jQuery UI中的DatePicker、My97等。

- 这些年,日历控件层出穷,用户可以根据需求,样式在互联网上下载到需要的日历控件

My97日历插件

- My97日历是目前互联网比较常用的日历插件之一。

- My97具备更人性化、更全面的功能,并且具备非常强大的日期范围限制功能

- My97日历插件使用步骤

- step 1: 下载My97相关的压缩文件(css、js、图像文件),下载地址 http://www.my97.net/

- step 2: 引入WdatePicker.js文件(只需要这一个文件即可,css文件户自动引入)

- step 3: 根据需求完成功能

默认日历

- 下面代码能够在页面中显示默认的My97日历

属性

- 以下是My97的常用属性

内置函数

- $dp.$D(id,object):将id对应的日期框中的日期字符串,加上定义的日期差量,返回使用real格式化后的字符串。

- Id:    对象的ID

- object:日期差量,可设置成{y:值,M:值,d:值,H:值,m:值,s:值}

- {M:3,d:7}表示3个月零7天

事件

- $onpicking : 选择日期时,激发的事件

- $onpicked  : 选择日期后,激发的事件

- $onclearing: 清楚已选日期时激发的事件

- $oncleared : 清除已选日期后激发的事件

- 事件对象   :dp

- dp.cal.getDateStr()   : 返回选择前的日期对象格式化值

- dp.cal.getNewDateStr(): 返回选择后的日期对象格式化值

三、表单验证插件

表单验证插件

- 表单验证插件主要是针对表单元素的值进行验证,并给出相应的图形以及文字提示。

- 常用验证插件

- formValidator

- jQuery.validator

- earyForm

formValidator

- 下载formValidator所需要的文件

- images: 验证过程中要用到的图像文件夹

- style:f ormValidator验证过程中要用到的样式文件夹validator.css

- jqeury_last.js: jquery文件,可被替换成自己的

- formValidator.js: 验证的核心文件,大部分验证规则都存在与此

- formValidatorRegex.js: 有关自定义正则表达式的验证文件

- index.html: 说明、案例等起始页

验证方式

- formValidator 支持5种验证方式

公共函数

- $.formValidator.initConfig

formValidator函数

Invalidator

CompareValidator

RegexValidator

总结:本章内容主要介绍了 jQuery 使用插件(使用插件、日历插件、表单验证插件)

时间: 2024-10-17 07:45:19

JavaScript之jQuery-7 jQuery 使用插件(使用插件、日历插件、表单验证插件)的相关文章

【锋利的jQuery】表单验证插件踩坑

和前几篇博文提到的一样,由于版本原因,[锋利的jQuery]表单验证插件部分又出现照着敲不出效果的情况. 书中的使用方法: 1. 引入jquery源文件, 2. 引入表单验证插件js文件, 3. 在form中class类名中添加"required","email"等去作为验证时读取的参数. 4. 调用代码: $("#commentform").validate(); 很不幸,报错了.前端有个说法是学新不学旧,这里就不去深究原因,直接提供最新的写法

【jQuery基础学习】06 jQuery表单验证插件-Validation

jQuery的基础部分前面都讲完了,那么就看插件了. 关于jQuery表单验证插件-Validation validation特点: 内置验证规则:拥有必填.数字.E-Mail.URL和信用卡号码等19类内置验证规则 自定义验证规则:可以很方便地自定义验证规则 简单强大的验证信息提示:默认了验证信息提示,并提供了自定义覆盖默认提示信息的功能 实时验证:可以通过keyup或者blur事件触发验证,而不仅仅在表单提交的时候验证 使用方法: 引用jQuery库和Validation插件 <script

jQuery表单验证插件----通过name属性来关联字段来验证,改变默认的提示信息,将校验规则写到 js 代码中

一.下载依赖包 网盘下载:https://yunpan.cn/cryvgGGAQ3DSW  访问密码 f224 二. 添加一个另外一个插件jquery.validate.messages_cn.js. 改变默认提示方式. 三.jQuery表单验证插件----通过name属性来关联字段来验证,将校验规则写到 js 代码中. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.

jQuery学习之:Validation表单验证插件

http://polaris.blog.51cto.com/1146394/258781/ 最近由于公司决定使用AJAX + Struts2来重构项目,让我仔细研究一下这两个,然后集中给同事讲讲,让每个人都能够有所掌握,慢慢会用.于是,自己便开始学习…… 由于Struts2自己早就学过,因而不需要花多少时间.而AJAX之前没怎么用过.现在AJAX框架如此之多,选择哪一个呢?开始打算选择 dojo,但是看了一点后,发现蛮复杂的.在之前有学过一点点jQuery,而网上也说jQuery很强大而且很容易

表单验证插件之jquery.validate.js

提到表单验证的插件,第一个想到的就是jquery.validate.js,所以小生想在这里稍微详细地说一下这款插件的具体使用方法,便于理解,我直接附上整段demo的代码(没怎么调样式,主要是看js): <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>JQuery表单验证插件jQuery.validate.js</title> <sty

jQuery Validate 表单验证插件----自定义校验结果样式

一.下载依赖包 网盘下载:https://yunpan.cn/cryvgGGAQ3DSW  访问密码 f224 二.引入依赖包 <script src="../../scripts/jquery-1.3.1.js" type="text/javascript"></script> <script src="lib/jquery.validate.js" type="text/javascript"

jQuery Validate 表单验证插件----自定义一个验证方法

一.下载依赖包 网盘下载:https://yunpan.cn/cryvgGGAQ3DSW  访问密码 f224 二.引入依赖包 <script src="../../scripts/jquery-1.3.1.js" type="text/javascript"></script> <script src="lib/jquery.validate.js" type="text/javascript"

jQuery表单验证插件----利用jquery.metadata.js将校验规则写到控件中

一.下载依赖包 网盘下载:https://yunpan.cn/cryvgGGAQ3DSW  访问密码 f224 二. 添加一个另外一个插件jquery.metadata.js 并把校验规则写在控件里面. 三.需要改写触发校验的方式. $("#commentForm").validate({meta: "validate"}); 四.详细代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transit

(转)强大的JQuery表单验证插件 FormValidator使用介绍

jQuery formValidator表单验证插件是客户端表单验证插件.在做B/S开发的时候,我们经常涉及到很多表单验证,例如新用户注册,填写个人资料,录入一些常规数据等等.在这之前,页面开发者(JavaScript开发者)需要编写大量的JavaScript来进行表单元素的校验,而这些校验在平时开发中不停的重复书写.常见的校验如不能为空,必须满足长度要求,必须为数字,必须为Email等等.一般要判断的表单元素比较多,开发过程就显得枯燥无味--重复的代码不断重复,而且可能还要兼容多种浏览器,更多