2017-07-24 更新:增加单例模式。

jquery插件开发框架代码

/*
* 插件编写说明:
* 1、插件命名:jquery.[插件名].js,如jquery.plugin.js
* 2、对象方法添加到jQuery.fn上,全局方法添加到jQuery对象本身上
* 3、插件内部的this指向通过选择器获取的jQuery对象
* 4、可以使用this.each遍历所有的元素
* 5、所有的方法以分号结束;插件头部先添加一个分号
* 6、插件应该返回一个jQuery对象,以保证插件的链式操作
* 7、使用闭包形式,使用$作为jQuery的别名以避免冲突
* 8、单例模式
*/ //为了兼容性良好,开始前有个分号
; //传入jQuery是为了确保在匿名函数中正确的使用jQuery对象,防止多库共存时$冲突
//传入window、document并非必须,只不过为了更快的访问window和document
//获得没有未被修改的 'undefined',因为实际并没有传递这个参数。
(function($, win, doc, undefined) { var alertPlugin = function(opts) {
//保存this变量
var _self = this; //定义默认参数
_self.opts = {
content: '弹出内容'
}; //根据传入的参数扩展默认参数
if(opts && $.isPlainObject(opts)) {
$.extend(_self.opts, opts);
} //调用函数方法
_self.show(_self.opts);
}; //函数方法实现
alertPlugin.prototype = {
show: function(opts) {
alert(opts.content);
}
} //扩展插件
$.fn.extend({
alertPlugin: function(opts) {
//遍历所有元素
return this.each(function() {
//单例模式
var instance;
if(!instance) {
instance = new alertPlugin(opts);
}
});
}
});
})(jQuery, window, document); //jQuery,window,document作为实参

插件调用

//未传递参数的调用
$('.a').alertPlugin();
//传递参数的调用
$('.a').alertPlugin({content: '新弹出内容'});

jquery插件开发通用框架的更多相关文章

  1. jQuery插件开发(转)

    jQuery插件开发 - 其实很简单 [前言]jQuery已经被广泛使用,凭借其简洁的API,对DOM强大的操控性,易扩展性越来越受到web开发人员的喜爱,我在社区也发布了很多的jQuery插件,经常 ...

  2. jQuery插件开发 - 其实很简单

    [前言] jQuery已经被广泛使用,凭借其简洁的API,对DOM强大的操控性,易扩展性越来越受到web开发人员的喜爱,我在社区也发布了很多的jQuery插件,经常有人询问一些技巧,因此干脆写这么一篇 ...

  3. jQuery插件开发——全屏切换插件

    这个插件包含三个部分:HTML结构.CSS代码和JS代码. HTML结构是固定的,结构如下: <!--全屏滚动--> <div class="fullpage-contai ...

  4. JavaScript学习笔记(四)——jQuery插件开发与发布

    jQuery插件就是以jQuery库为基础衍生出来的库,jQuery插件的好处是封装功能,提高了代码的复用性,加快了开发速度,现在网络上开源的jQuery插件非常多,随着版本的不停迭代越来越稳定好用, ...

  5. JavaScript学习总结(四)——jQuery插件开发与发布

    jQuery插件就是以jQuery库为基础衍生出来的库,jQuery插件的好处是封装功能,提高了代码的复用性,加快了开发速度,现在网络上开源的jQuery插件非常多,随着版本的不停迭代越来越稳定好用, ...

  6. jQuery插件开发(溢出滚动)

    声明:此程序仅针对手机端,简单的封装一个插件,意在记载插件的开发过程,如有错误及不足之处,还望即时指出. 移动开发的时候,我们经常会遇到滑动事件,众所周知手机端滑动主要依靠touch事件.最近接连遇到 ...

  7. jQuery插件开发的五种形态[转]

    这篇文章主要介绍了jQuery插件开发的五种形态小结,具体的内容就是解决javascript插件的8种特征,非常的详细. 关于jQuery插件的开发自己也做了少许研究,自己也写过多个插件,在自己的团队 ...

  8. 掌握jQuery插件开发

    进行jQuery插件开发前,首先要知道两个问题:什么是jQuery插件?jQuery插件如何使用? 第一个问题,jQuery插件就是用来扩展jQuery原型对象的一个方法,简单来说就是jQuery插件 ...

  9. 掌握jQuery插件开发,这篇文章就够了

    ---恢复内容开始--- 在实际开发工作中,总会碰到像滚动,分页,日历等展示效果的业务需求,对于接触过jQuery以及数据jQuery使用的人来说,首先想到的肯定是寻找现有的jQuery插件来满足形影 ...

随机推荐

  1. Unity消息

    GameObject关于Message带有三种方法, gameObject.SendMessageUpwards ("test1",4);gameObject.SendMessag ...

  2. POJ2155【二维树状数组,区间修改,点查询?】【又被输入输出坑】

    这题反反复复,到现在才过. 这道题就是树状数组的逆用,用于修改区间内容,查询点的值. 如果单纯就这个奇偶数来判的话,似乎这个思路比较好理解. 看了一下国家集训队论文(囧),<关于0与1在信息学奥 ...

  3. MyBatis入门实例-包括实体类与数据库字段对应&CLOB字段处理

    1.我的开发环境是 jdk1.7+ecplise+oracle 11g 用到的jar包:mybatis-3.1.1.jar ojdbc6.jar 2.项目整体结构     3.首先配置conf.xml ...

  4. Geeks 一般二叉树的LCA

    不是BST,那么搜索两节点的LCA就复杂点了,由于节点是无序的. 以下是两种方法,都写进一个类里面了. 当然须要反复搜索的时候.能够使用多种方法加速搜索. #include <iostream& ...

  5. 配置NGINX支持中文URL 中文文件名称或文件夹404无法訪问的解决方法

    NGINX不须要象apache那样要单独载入支持中文模块. # cat /etc/sysconfig/i18n  LANG="en_US.UTF-8" SYSFONT=" ...

  6. 26复杂类型比较,使用Compare .NET objects组件

    关于比较对象,在"06判等对象是否相等"中大致可以总结为:   关于比较方法: ● 实例方法Equals(object obj)既可以比较值类型,也可以比较引用类型 ● 静态方法E ...

  7. failed to get the task for process XXX(解决方案)

    引人: iOS真机调试程序,报如下错误信息: failed to get the task for process XXX 原因: 证书问题,project和targets的证书都必须是开发证书,AD ...

  8. [翻译] Core Text Objective-C Wrapper

    Core Text Objective-C Wrapper https://github.com/akosma/CoreTextWrapper Introduction(介绍) One of the ...

  9. hdu 3123 GCC (2009 Asia Wuhan Regional Contest Online)

    GCC Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 131072/131072 K (Java/Others) Total Subm ...

  10. 单点登录(SSO)问题

    单点登录(Single Sign On),简称为 SSO,是目前比较流行的企业业务整合的解决方案之一.SSO的定义是在多个应用系统中,用户只需要登录一次就可以访问所有相互信任的应用系统.