jquery插件开发通用框架
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插件开发通用框架的更多相关文章
- jQuery插件开发(转)
jQuery插件开发 - 其实很简单 [前言]jQuery已经被广泛使用,凭借其简洁的API,对DOM强大的操控性,易扩展性越来越受到web开发人员的喜爱,我在社区也发布了很多的jQuery插件,经常 ...
- jQuery插件开发 - 其实很简单
[前言] jQuery已经被广泛使用,凭借其简洁的API,对DOM强大的操控性,易扩展性越来越受到web开发人员的喜爱,我在社区也发布了很多的jQuery插件,经常有人询问一些技巧,因此干脆写这么一篇 ...
- jQuery插件开发——全屏切换插件
这个插件包含三个部分:HTML结构.CSS代码和JS代码. HTML结构是固定的,结构如下: <!--全屏滚动--> <div class="fullpage-contai ...
- JavaScript学习笔记(四)——jQuery插件开发与发布
jQuery插件就是以jQuery库为基础衍生出来的库,jQuery插件的好处是封装功能,提高了代码的复用性,加快了开发速度,现在网络上开源的jQuery插件非常多,随着版本的不停迭代越来越稳定好用, ...
- JavaScript学习总结(四)——jQuery插件开发与发布
jQuery插件就是以jQuery库为基础衍生出来的库,jQuery插件的好处是封装功能,提高了代码的复用性,加快了开发速度,现在网络上开源的jQuery插件非常多,随着版本的不停迭代越来越稳定好用, ...
- jQuery插件开发(溢出滚动)
声明:此程序仅针对手机端,简单的封装一个插件,意在记载插件的开发过程,如有错误及不足之处,还望即时指出. 移动开发的时候,我们经常会遇到滑动事件,众所周知手机端滑动主要依靠touch事件.最近接连遇到 ...
- jQuery插件开发的五种形态[转]
这篇文章主要介绍了jQuery插件开发的五种形态小结,具体的内容就是解决javascript插件的8种特征,非常的详细. 关于jQuery插件的开发自己也做了少许研究,自己也写过多个插件,在自己的团队 ...
- 掌握jQuery插件开发
进行jQuery插件开发前,首先要知道两个问题:什么是jQuery插件?jQuery插件如何使用? 第一个问题,jQuery插件就是用来扩展jQuery原型对象的一个方法,简单来说就是jQuery插件 ...
- 掌握jQuery插件开发,这篇文章就够了
---恢复内容开始--- 在实际开发工作中,总会碰到像滚动,分页,日历等展示效果的业务需求,对于接触过jQuery以及数据jQuery使用的人来说,首先想到的肯定是寻找现有的jQuery插件来满足形影 ...
随机推荐
- HEVC 实时编码720P不是梦!
最近很少光顾我的博客, 因为一直很忙! 目前我的HEVC在i5机子上720P编码速度单核达到2~3帧每秒! 多核的话离线实时编码已经不是问题! 现在问题是在线实时编码还差那么一点! 在容忍一定低延迟下 ...
- 使用DataGridView进行增删改查,并同步到数据库
DataGridView控件具有极高的可配置性和可扩展性.它提供有大量的属性.方法和事件,能够用来对该控件的外观和行为进行自己定义.以下通过一个小样例来展示DataGridView进行增删改查,并同步 ...
- Google Admob广告Android全攻略1
一.登录Google AdMob中文官网:http://www.google.cn/ads/admob/ ,注册帐号. 1.点击注册AdMob帐号 2.进入Google帐号注册页面,因为要创建一个 ...
- KJBitmap使用方法
摘要 本文原创,转载请注明地址:http://kymjs.com/code/2015/03/25/01 摘要 好像最近一个月都没有写博客了,正好伴着KJFrameForAndroid 更新v2.14版 ...
- Oracle 10g AND Oracle 11g手工建库案例--Oracle 10g
Oracle 10g AND Oracle 11g手工建库案例--Oracle 10g 系统环境: 操作系统: RedHat EL6 Oracle: Oracle 10g and Oracle 11 ...
- 读取siftgeo格式文件的matlab程序
% This function reads a siftgeo binary file %读取siftgeo格式的二进制文件 % % Usage: [v, meta] = siftgeo_read ( ...
- iOS:UIButton按钮的详解
UIButton的详细介绍: 一.按钮具有的属性: @property(nonatomic,readonly) UIButtonType buttonType; //按钮形状类型 @property ...
- Objective-C:MRC手动释放对象内存举例(引用计数器)
手机内存下的类的设计练习: 设计Book类, 1.三个成员变量: title(书名)author(作者).price(价格) 2.不使用@property,自己完成存取方法(set方法,get方 ...
- 【转载】Hybrid APP了解
原文:http://uikoo9.com/blog/detail/hpp 不错的hybrid app框架:http://www.dcloud.io/case/#group-1 HPP hybirdAp ...
- RV 多样式 MultiType 聊天界面 消息类型 MD
Markdown版本笔记 我的GitHub首页 我的博客 我的微信 我的邮箱 MyAndroidBlogs baiqiantao baiqiantao bqt20094 baiqiantao@sina ...