JQuery实践--插件

  • jQuery插件的概览
    http://docs.jquery.com/Plugins
    http://jquery.com/plugins/most_popular
  • 官方的表单插件
    http://jquery.com/plugins/project/form    
    jquery.form.js
      
    获得表单控件的值        
    收集包装集里所有成功表单控件的值,返回这些值构成的字符串数组。没有值就返回空数组 fieldValue(excludeUnsuccessfull) bool:false不成功控件也收集 值的数组  
    表单程控机返回已编码的字符串. 包装集里的一个表单 formSerialize(semantic) bool:true 按顺序。false:随机 生成的查询字符串  
    包装集里的所有控件。并可用于对表单的一部分进行序列化 fieldSerialize(excludeUnsuccessful) 。。。。 生成的查询字符串  
    使表单控件清空和复位  
    清除包装集里任何控件的值,或包装集元素的后代节点 clearForm()   包装集  
    原生 reset()方法 resetForm()   包装集  
    通过Ajax提交表单        
    如果应用到包含表单的包装集,就获取目标表单的所有成功控件的名称和值并且作为Ajax请求进行提交 ajaxSubmit(options) 对象或函数.散列对象或成功回调函数
    url: 默认来自表单的action
    type:默认表单的method
    dataType: xml/json/script
    target: 字符串|对象|元素 指定一个或多个DOM元素来接受响应体作为内容
    beforeSubmit:函数 .发起请求前调用。如果该函数返回False,则表单提交被取消。 3个参数:数据值的对象(name,value)数组,jQuery匹配集,options对象

    success: 回调函数,请求完成时调用。参数: 根据dataType格式的响应体,success字符串,ajaxSubmit()命令的jQuery匹配集
    clearForm: true/false 成功后清空
    resetForm: ture/false
    semantic: true/false  顺序还是随机
    其他ajax选项.

    包装集  
    设置表单,提交表单并阻止通过正常语义事件 ajaxForm(options) .... 包装集  
    删除应用到包装集里表单上的设置,以便表单提交能够以正常方式进行 ajaxFormUnbind()   包装集  
  • 官方的尺寸插件
    返回包装集里第一个元素,窗口或文档对象的宽度 width()   窗口,文档或元素的宽度  
    高度 height()   窗口,文档或元素的高度  
      innerWidth()   第一元素的内部宽度  
      innerHeight()      
      outerWidth() options: 散列对象接受单个选项,即外边距,指定是否应该把外边距计算进去.默认为false    
      outerHeight()      
    获取或设置窗口,文档或可滚动内容元素的尺寸。滚动元素是包含内容的元素 scrollTop(value)  设置滚动顶边或左边尺寸的值  包装集或尺寸  
      scrollLeft(value)      
     返回包装集中第一个元素的偏移父元素。带有relative或absolute的position的值  offsetParent()    偏移父元素  
     第一元素相对于偏移父元素的位置值  position()    object: top,left  
    第一个元素的偏移信息 offset(options,results) options: relativeTo,lite,scroll,padding,border,margin
    results:接收结果
    包装集或结果  
  • 实时查询插件
    为匹配选择器的元素而建立事件处理程序
    在任何元素匹配选择器时,触发函数的执行
    在任何元素不再匹配选择器时,触发函数的执行
    返回包装集
    livequery(event,listener): 建立一个函数作为指定事件类型的事件处理程序,既在匹配集里所有的元素上,也在随后与匹配集的选这群相匹配的任何元素上。
                                         在元素因为被改变而不再匹配原始选择器时执行操作。为匹配的添加事件处理程序,为不匹配的删除事件处理程序
    livequery(onmatch,onmismatch): 匹配时一个函数,不匹配时另一个函数处理程序
    $.livequery.run():强制 live query触发其监听器. 执行元素的全局求值
    expire():  删除与匹配集的选择器相关联的监听器
    expire(event,listener)
    expire(onmatch,onmismatch)

  • UI插件
    http://docs.jquery.com/ui
    鼠标交互,小部件,可视化效果

时间: 2024-08-02 08:18:00

JQuery实践--插件的相关文章

JavaScript之jQuery-9 jQuery 开发插件(添加新全局函数、添加jQuery对象方法、添加新简写方法、方法参数)

一.添加新的全局函数 全局函数 - 全局函数,实际上就是jQuery对象的方法,从实践角度看,它们是位于jQuery命名空间内部的函数 - jQuery内置的某些功能是通过全局函数实现的 - $.ajax()函数就是典型的全局函数 - 向jQuery命名空间添加一个函数,只需要将这个新函数指定为jQuery的一个属性值   - 如果要使用该全局函数时,可通过一下代码调用 - 也可以通过别名来调用 添加多个函数 - 如果我们想在插件中提供多个全局函数,可以独立的声明这些函数   - 还可以使用$.

jquery编写插件(转)

阅读目录 基本方法 支持链式调用 让插件接收参数 面向对象的插件开发 关于命名空间 关于变量定义及命名 压缩的好处 工具 GitHub Service Hook 原文:http://www.cnblogs.com/Wayou/p/jquery_plugin_tutorial.html 要说jQuery 最成功的地方,我认为是它的可扩展性吸引了众多开发者为其开发插件,从而建立起了一个生态系统.这好比大公司们争相做平台一样,得平台者得天下.苹果,微软,谷歌等巨头,都有各自的平台及生态圈. 学会使用j

Jquery Media插件使用,解决在线预览及打开PDF文件

用到过PDF的媛媛and猿猿们,总会发现这大千世界之万能播放器插件,总能少了对媒体控制的接口. 你总会发现PDF无法像img图片一样正常加载展现出来,那么我们在通用语法的基础上拓展出了适用于预览及打开的PDF插件便于开发应用. 最主要的是使用到了一个jquery的插件jquery.media.js,使用这个插件就很容易实现了. 该插件可以播放多种类型的多媒体文件包括:Flash, Quicktime, Windows Media Player, Real Player, MP3, Silverl

jQuery.fly插件实现添加购物车抛物线效果

样例 使用电商 APP 购买商品时,很多都有上图的红色小球抛物线效果,下面通过 jQuery.fly 插件来实现一个简单 Demo. 实现 简单思路: 确定抛物线的起始和终止位置: 通过 js 在起始位置创建一个 document 对象,作为红色小球: 通过 jQuery.fly 插件提供的fly函数来移动小球,移动至终止位置: 当小球到达终止位置后,通过fly插件提供的 onEnd 回调函数,将小球销毁: Demo 源码: <!DOCTYPE html> <html lang=&quo

asp.net 实现在线打印功能,jQuery打印插件PrintArea实现自动分页

使用的组件:jQuery打印插件PrintArea,有兴趣的可以研究一下. 使用方法略过,这里将介绍如何实现打印多页是可以分页. 现在提供两种方法思路: 1.根据特定的打印机型号和使用的纸张类型,然后用JS来算出每页多高,按照每张纸的高度来进行适当的增减高度.(这种方式缺点就是只能针对单中类型的纸张,计算十分的繁琐,要些很多加减法 -_-);). 参考A4纸高度的网页:http://www.jb51.net/office/word/67360.html 2.在如上一个思路的方式,试着查找能不能自

jquery.cookie插件使用

jquery.cookie插件是一个在浏览器端对cookie进行操作的,使用非常方便. jquery.cookie中的操作: jquery.cookie.js插件:百度即可下载 创建一个会话cookie: $.cookie(‘cookieName’,'cookieValue’); 注:当没有指明cookie时间时,所创建的cookie有效期默认到用户浏览器关闭止,故被称为会话cookie. 创建一个持久cookie: $.cookie(‘cookieName’,'cookieValue’,{ex

jQuery验证插件

学习要点: 1.使用 validate.js 插件 2.默认验证规则 3.validate()方法和选项 4.validate.js 其他功能 验证插件(validate.js),是一款验证常规表单数据合法性的插件.使用它,极大的解放了在表单上繁杂的验证过程,并且错误提示显示的完善也增加了用户体验. 一.使用 validate.js 插件 官网下载:http://bassistance.de/jquery-plugins/jquery-plugin-validation最重要的文件是valida

jQuery幻灯片插件Skippr

Skippr是一款带左右箭头,索引按钮,滑动切换效果并且轻量.快速的幻灯片 设置 引入jquery.skippr.css.jquery.js.jquery.skippr.js 注意jQuery必须在jquery.skippr.js之前 <head> <link href="css/jquery.skippr.css" rel="stylesheet" type="text/css" > <script src=&qu

jQuery图片插件自动轮播原理解析

经常看到项目要用到图片轮播效果,一般的操作流程都是先到网上找一个好看的JQuery图片轮播插件,然后看下demo,再配下参数.好了,关机下班回家 其余的就交给插件吧. 是不是感觉有了jQuery,世界变得那么美好呢. 本人最近用的一个插件是 jquery.carousel.js,官方网站是:http://richardscarrott.co.uk/posts/view/jquery-carousel-plugin 下面,我们来讨论一下图片轮播原理. 首先来个简单的demo 效果图如下: 这是个导