如何开发一个JQuery插件


Posted in 面试题 onJuly 28, 2016
JQuery有两种开发插件的方法:
jQuery.fn.extend(object);
jQuery.extend(object);
jQuery.extend(object);方法为扩展jQuery类本身.并为类添加新的方法。
jQuery.fn.extend(object)方法是给jQuery对象添加方法。
jQuery.fn = jQuery.prototype.
虽然 javascript 没有明确的类的概念,但是用类来理解它,会更方便。
jQuery便是一个封装得非常好的类,比如我们用 语句 $(“#btn1″) 会生成一个 jQuery类的实例。
jQuery.extend(object); 为jQuery类添加添加类方法,可以理解为添加静态方法。如:
$.extend({
add:function(a,b){return a+b;}
});
便为 jQuery 添加一个为 add 的 “静态方法”,之后便可以在引入 jQuery 的地方,使用这个方法了,
$.add(3,4); //return 7
jQuery.fn.extend(object); 对jQuery.prototype进得扩展,就是为jQuery类添加“成员函数”。jQuery类的实例可以使用这个“成员函数”。
比如我们要开发一个插件,做一个特殊的编辑框,当它被点击时,便alert 当前编辑框里的内容。可以这么做:
Java代码
1. $.fn.extend({
2.
3. alertWhileClick:function(){
4.
5. $(this).click(function(){
6.
7. alert($(this).val());
8. });
9.
10. }
11.
12. });
13.
14. $(“#input1″).alertWhileClick(); //页面上为:
$.fn.extend({
alertWhileClick:function(){
$(this).click(function(){
alert($(this).val());
});
}
});
$(“#input1″).alertWhileClick(); //页面上为:
$(“#input1″) 为一个jQuery实例,当它调用成员方法 alertWhileClick后,便实现了扩展,每次被点击时它会先弹出目前编辑里的内容。
jQuery提拱了丰富的操作文档,事件,CSS ,Ajax、效果的方法,结合这些方法,便可以开发出更加 Niubility 的插件。

Tags in this post...

面试题 相关文章推荐
如何实现jdbc性能优化
Jul 30 面试题
程序运行正确, 但退出时却"core dump"了,怎么回事
Feb 19 面试题
介绍一下代理模式(Proxy)
Oct 17 面试题
杭州联环马网络笔试题面试题
Aug 04 面试题
关于VPN
Jun 10 面试题
可靠的数据流传输TCP
Mar 15 面试题
C#里面如何倒序排列一个数组的元素?
Jun 21 面试题
一些Unix笔试题和面试题
Jan 22 面试题
软件配置管理有什么好处
Apr 15 面试题
如何将无状态会话Bean发布为WEB服务,只有无状态会话Bean可以发布为WEB服务?
Dec 03 面试题
EJB与JAVA BEAN的区别
Aug 29 面试题
SOA的常见陷阱或者误解是什么
Oct 05 面试题
什么是GWT的Entry Point
Aug 16 #面试题
AJAX的优缺点都有什么
Aug 18 #面试题
DOM和JQuery对象有什么区别
Nov 11 #面试题
主要的Ajax框架都有什么
Nov 14 #面试题
如何用JQuery进行表单验证
May 29 #面试题
Ajax主要包含了哪些技术
Jun 12 #面试题
如何整合JQuery和Prototype
Jan 31 #面试题
You might like
php中时间轴开发(刚刚、5分钟前、昨天10:23等)
2011/10/03 PHP
ThinkPHP表单自动提交验证实例教程
2014/07/18 PHP
PHP使用file_get_content设置头信息的方法
2016/02/14 PHP
javascript 无提示关闭窗口脚本
2009/08/17 Javascript
读jQuery之十四 (触发事件核心方法)
2011/08/23 Javascript
javascript标签在页面中的位置探讨
2013/04/11 Javascript
js 编码转换 gb2312 和 utf8 互转的2种方法
2013/08/07 Javascript
JS读取XML文件示例代码
2013/11/15 Javascript
排序算法的javascript实现与讲解(99js手记)
2014/09/28 Javascript
JavaScript调试的多个必备小Tips
2017/01/15 Javascript
vue2.0 自定义日期时间过滤器
2017/06/07 Javascript
浅谈JS中的常用选择器及属性、方法的调用
2017/07/28 Javascript
浅谈ECMAScript6新特性之let、const
2017/08/02 Javascript
使用Vue开发动态刷新Echarts组件的教程详解
2018/03/22 Javascript
vue文件树组件使用详解
2018/03/29 Javascript
JavaScript求一组数的最小公倍数和最大公约数常用算法详解【面向对象,回归迭代和循环】
2018/05/07 Javascript
JavaScript实现计算圆周率到小数点后100位的方法示例
2018/05/08 Javascript
js调用设备摄像头的方法
2018/07/19 Javascript
vue $set 给数据赋值的实例
2019/11/09 Javascript
JS实现拖拽元素时与另一元素碰撞检测
2020/08/27 Javascript
vue 递归组件的简单使用示例
2021/01/14 Vue.js
[28:05]完美世界DOTA2联赛循环赛Inki vs DeMonsTer 第一场 10月30日
2020/10/31 DOTA
解决Python运行文件出现out of memory框的问题
2018/12/03 Python
python学生管理系统开发
2019/01/30 Python
python 搜索大文件的实例代码
2019/07/08 Python
Django url,从一个页面调到另个页面的方法
2019/08/21 Python
Python Django 简单分页的实现代码解析
2019/08/21 Python
Python实现图片查找轮廓、多边形拟合、最小外接矩形代码
2020/07/14 Python
【HTML5】Canvas绘制简单图片教程
2016/05/13 HTML / CSS
新加坡第一的杂货零售商:NTUC FairPrice
2020/12/05 全球购物
幼儿师范毕业生自荐信
2013/11/09 职场文书
酒店营销策划方案
2014/02/07 职场文书
大学学生会竞选演讲稿
2014/04/25 职场文书
学生违反校规检讨书
2014/10/28 职场文书
消防安全月活动总结
2015/05/08 职场文书
vue实现Toast组件轻提示
2022/04/10 Vue.js