JQ插件

---恢复内容开始---

什么是插件

　　插件(plugin)是JQuery的扩展(Extension)，以JQuery的核心代码为基础，是一种遵循一定规范的应用程序接口编写出来的程序。

插件的引入

  1. 引入jquery.js文件
  2. 引入插件的js文件
  3. 引入插件的周边文件,如皮肤，语言包等

插件的使用

　　可在jqurey的官网上查看JQ的各种插件：http://plugins.jquery.com/

　　

　　在点击进入某一插件后，可看到插件的版本等信息，常用的Try a Demo（运行样式）和Read the Docs（查看使用文档）

　　

自定义插件

　　按形式分类

  • 封装对象方法的插件（基于某个DOM元素的对象，局部性）
  • 封装全局函数的插件
  • 选择器插件（如find()）

　　封装要点

  • 插件名推荐使用jqurey.[插件名].js，避免冲突
  • 局部对象附加jquery.fn对象上，全局函数附件在jqurey上
  • 插件内部，this指向当前局部对象
  • 可以通过this.each()遍历所有元素
  • 所有的插件或方法必须以‘;’结尾，避免出现问题，最好以‘;’开头
  • 插件应返回JQuery对象，以保证链式连缀
  • 避免在插件内部使用‘$’，如要使用，传递JQurey进去

　　

时间： 2024-08-09 14:44:27

JQ插件的相关文章

jq插件的编写方法（自定义jq插件）---转

本JQ插件例子是在你网站的文章结尾处添加你的版权. JQ插件标准的封装代码如下,首先需要闭包: 1 <script type="text/javascript"> 2 (function ($) { 3 //这里放入插件代码 4 })(jQuery); 5 </script> 这是jQuery官方的插件开发规范,这样写是作用是:1. 避免全局依赖.2. 避免第三方破坏.3. 兼容jQuery操作符'$'和'jQuery' 接着给插件加入主体: 1 <scr

移动端那些事；hammer不错的jq插件。

从pc端到移动端相信很多前端攻城师为移动端发愁,写原声的手机端事件是非常费力的, 而jq的click有300毫秒延迟,现在有了比较不错的jq插件hammer,Hammer.js是一个开源的,轻量级的javascript库,它可以在不需要依赖其他东西的情况下识别触摸,鼠标事件支持各种手机事件,比如缩放 ,qq左滑动删除,  放大, 旋转等. 下面用一个tab切换来介绍hammer. 用法: 1,首先引入jq2.0以上版本和jquery.hammer.js. 2,获取元素,和jq一样,在后面加上ha

JQ插件案例-基于jquery和canvas的调色板

最近在研究canvas,想要弄一个canvas的所见所得工具. 在研究的过程中,猛然发现调色板不太好实现. 通过多方面研究及翻阅文献,发现网上对于调色板的实现大都是产生一个色块列表而已. 这种方式丑爆了好吧,而且选颜色麻烦死了,绿色还分那么多个块,怎么能好好选到自己心仪的颜色呢? 论插件来说的话,有一个插件还不错,基本和Photoshop的调色板差不多: 官网:spectrum 这款调色板还算比较符合我个人喜好,而且demo显示的功能也非常不错. 我没有下载,也没有去仔细研究它的实现方式,粗看了

写一个简单的JQ插件(例子)

虽然现在 vue angular react 当道啊但是那 JQ还是有一席之地很多很多的小单位啊.其实还会用到 我也放一个例子吧虽然我也不是很肯定有没有人写的比我更好啊但是我相信 我这个还是蛮实用的 话不多说 丢代码 JQ插件标准的封装代码如下,首先需要闭包: <scripttype="text/javascript"> (function ($) {  //这里放入插件代码 })(jQuery); </script> 这是jQuery官方的插件开发规范,这样写

个人学习JQ插件编写成果：little酷炫的图片滑动切换效果

工作一个多月了,好久没来冒冒泡了,看了@wayong的JQ插件教程,自己编写了一个模仿拉勾网首页广告栏滑动特效的JQ插件,现在跟朋友们分享分享! 先上demo链接:http://runjs.cn/detail/gpowdhhk 快要下班了~先把代码放出来~~回家再编辑~ 这里是HTML代码: 1 <!--js酷炫图片滑动hover效果,类似拉勾网--> 2 <div class="beauty-go-outer" id="my-div"> 3

JQ插件之imgAreaSelect实现对图片的在线截图功能（java版）

前言:在做网站的时候经常用的功能就是,用户上传图片对自己上传的图片进行截图,DIV自己的头像.或者上传幻灯片大图进行DIV设置小图. 解决方案:目前我知道的解决方案有两个如下:       一.flash用户上传头像组件 ,地址:  http://www.hdfu.net/index.html (但收费)      二.jq插件imgAreaSelect, 地址:http://odyniec.net/projects/imgareaselect/ 注:官网文档为英文的,如果想看中文的这里也有,h

jq插件第二款来袭 图片滚动

这第二款也是非常实用的插件,也是与图片相关,关于图片的需求太多了,这个是图片滚动哦,不过不是无缝滚动,是左像右滚动,到头的话再往回滚动,利用scrollLeft实现的,支持自动滚动和每次滚动的个数默认为1张,另外提供了连个外接方法, 停止自动滚动$.fn.roll.stop,继续自动滚动$.fn.roll.auto,不多说,上菜! JQ插件代码 (function($){ $.fn.roll = function(options){ if($(this).length == 0) return

引用多个jq插件造成冲突时

在页面中引用了pikachoose插件和lightbox插件,会造成冲突,导致pikachoose插件无法使用 主要原因是 $ 符号不知道调用哪个jq插件 解决方法:(顺序不能错)

JQ插件机制

JQ插件概述 所谓的jquery插件,其实就是利用jquery语法,完成的一些工具或者模块.jquery插件是jQuery功能的扩展.可以让开发人员能更好更快速的完成某些特定的需求,只需要用很少的代码就能实现很好的效果. 自定义插件 JQ允许自定义插件,对JQ的方法进行扩展.自定义插件主要分两种: JQ元素扩展和JQ本身扩展. JQ元素扩展: 方法: jQuery.fn.extend(object) 概述 扩展 jQuery 元素集来提供新的方法(通常用来制作插件). 也就是说,该方法可以用来扩

jq插件验证

jq插件验证 :validate ; 1: form #form 在form内通过jq用ID选择器获取form里面的节点属性: 重点: 1:required        // 属性规定必需在提交之前填写输入字段. 2:equalTo        // 检测是否一致 notpass:{    //  notpass这个name的value                                                  equalTo:"#pass",     //