jQuery 插件开发指南
jQuery凭借其简洁的API,对DOM强大的操控性,易扩展性越来越受到web开发人员的喜爱,经常有人询问一些技巧,因此干脆写这么一篇文章给各位jQuery爱好者,算是抛砖引玉吧。
那么首先我们来简单的看一下最正统的 jQuery 插件定义方式:
(function ($) {
$.fn.插件名 = function (settings) {
//默认参数
var defaultSettings = {
} /* 合并默认参数和用户自定义参数 */
settings = $.extend(defaultSettings, settings);
return this.each(function () { //代码 }); //插件在元素内多次出现
} })(jQuery);
先来看模板中的第一行代码(当然我们要把这一行代码的后半部分给揪出来一起看,不然第一行就完全无意义了):
(function ($) {
})(jQuery);
这行代码其实是用于创建一个匿名函数。如果你对匿名函数和闭包不了解,将会对这种代码非常疑惑,那么强烈建议您阅读【详谈JavaScript 匿名函数及闭包】这篇文章。
jQuery 的继承方法 $.extend —— $.extend 在jQuery 插件开发中有个很重要的作用,就是用于合并参数。
$.fn.tip = function (settings) {
var defaultSettings = {
//颜色
color: 'yellow',
//延迟
timeout: 200 }
/* 合并默认参数和用户自定义参数 */
settings = $.extend(defaultSettings, settings);
alert(settings.input); <br>}
jQuery 插件定义第二种方式:
(function ($) {
//插件定义--更换名字
$.fn.tabpanel = function (method) {
var methods = $.fn.tabpanel.methods;
if (methods[method]) {
return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
} else if (typeof method === 'object' || !method) {
return methods.init.apply(this, arguments);
} else {
}
}
//支持的方法
$.fn.tabpanel.methods =
{
//初始化
init: function (p_options) {
tabpanelBind(p_options, this);
},
add: function (p_options) {
addTab(p_options, this);
tabpanelBind(p_options, this);
// debugger
} }
function add(p_options) {
var _defaults = {
id: ""
}
<br> //内部实现略.........<br> return _index;
}
<br>})(jQuery);<br><br>调用 $("#team").tabpanel('add',"");
转载于:https://www.cnblogs.com/sjqq/p/6400657.html
jQuery 插件开发指南相关推荐
- 【转载】jQuery插件开发精品教程,让你的jQuery提升一个台阶
jQuery插件开发精品教程,让你的jQuery提升一个台阶 要说jQuery 最成功的地方,我认为是它的可扩展性吸引了众多开发者为其开发插件,从而建立起了一个生态系统.这好比大公司们争相做平台一样, ...
- jQuery插件开发教程
jQuery插件开发精品教程,让你的jQuery提升一个台阶 要说jQuery 最成功的地方,我认为是它的可扩展性吸引了众多开发者为其开发插件,从而建立起了一个生态系统.这好比大公司们争相做平台一样, ...
- JavaScript学习笔记(四)——jQuery插件开发与发布
jQuery插件就是以jQuery库为基础衍生出来的库,jQuery插件的好处是封装功能,提高了代码的复用性,加快了开发速度,现在网络上开源的jQuery插件非常多,随着版本的不停迭代越来越稳定好用, ...
- jQuery插件开发 - 其实很简单
[前言] jQuery已经被广泛使用,凭借其简洁的API,对DOM强大的操控性,易扩展性越来越受到web开发人员的喜爱,我在社区也发布了很多的jQuery插件,经常有人询问一些技巧,因此干脆写这么一篇 ...
- jquery 插件开发的作用域及基础
2019独角兽企业重金招聘Python工程师标准>>> 之前一直有开发jquery插件的冲动,所以一直想学习如何进行插件开发,最近一个项目需要使用图片上传组件及自动无限下拉组件,百度 ...
- jQuery插件开发学习笔记
今天想了解一下jQuery的插件开发,于是google了一下,列在前面的两篇文章都很不错,jQuery插件开发全解析 更是将插件开发的方方面面细致入微的进行了讲解,并提供了PDF进行下载.笔者今天详细 ...
- jQuery权威指南(第2版)
为什么80%的码农都做不了架构师?>>> jQuery权威指南(第2版) 本书由国内资深web技术专家亲自执笔,4大web开发社区一致鼎力推荐,权威性毋庸置疑.内容新颖,基于j ...
- jQuery插件开发(一):jQuery类方法
一.jQuery插件开发的方法 jQuery插件的编写方法主要有两种: 1.基于jQuery对象的插件 2.基于jQuery类的插件 二.基于jQuery类的插件 1.什么是jQuery类的插件? j ...
- jQuery插件开发的两种方法及$.fn.extend的详解
2019独角兽企业重金招聘Python工程师标准>>> 作者: 字体:[增加 减小] 类型:转载 时间:2014-01-16 我要评论 jQuery插件开发分为两种:1 类级别.2 ...
最新文章
- HDU 6058 - Kanade's sum | 2017 Multi-University Training Contest 3
- 华为SDSec分为几层
- vue如何获取数组中的键值_vue中操作数组的相关方法
- wxpython控件如何自动调整大小_wxpython:自动调整静态图像(staticbitmap)的大小以适应大小...
- 计算机科学与技术mobi,080901-计算机科学和技术.PDF
- matlab信号内插,基于VC++和Matlab的数字信号内插处理系统
- android在java下建立模块,Android Studio:如何在Android模块中包含Java模块?
- 关于MDI窗体的那些问题
- javafx实现读者文摘上的文章预览及下载
- 分布式保存Session 和 StateServer 解决 Session过期
- war3鸿蒙大陆攻略,【魔兽rpg地图失落大陆攻略汇总】
- mysql 逗号_在MySQL字段中使用逗号分隔符的方法分享
- 基于Linux下的apache Web 服务
- 叽歪网CEO:创业路上也要学会忙中偷闲
- SPLAYER中文字幕乱码
- unity SteamVR利用手柄合理移动
- hexo 修改index.html,hexo--新建页面、修改主页
- OpenJudge-2152:Pots
- Android 计步器实现
- Scrapy爬取二手房成交记录并进行数据分析与展示(一)