JQuery插件开发示例代码


Posted in Javascript onNovember 06, 2013

JQuery 插件开发:
类级别开发,开发新的全局函数
对象级别开发,给Jquery对象开发新方法
一、类级别开发 -定义全局方法

jQuery.foo = function() {  
    alert('This is a test.');  
};

采用命名空间,可以避免命名空间内函数的冲突。
jQuery.apollo={  
    fun1:function(){  
        console.log('fun1');  
    },  
    fun2:function(){  
        console.log('fun2');  
    }  
} 

二、对象级别开发 -定义jQuery对象方法 

(function($) {     
$.fn.pluginName = function() {   };   
})(jQuery);  
//插件通过这样被调用:  
$('#myDiv').pluginName(); 

接受options参数以控制插件的行为
(function($){  
    $.fn.fun2=function(option){  
        var defaultOption={  
            param1:'param1',  
            param2:'param2'  
        }  
        $.extend(defaultOption,option);  
        console.log(defaultOption);  
    }  
})(jQuery);  
$(function(){  
    //通过这样调用  
    $("body").fun2({  
        param1:'new Param1'  
    });  
}); 

保持私有函数的私有性
 (function($) {    
  // plugin definition    
  $.fn.hilight = function(options) {    
    debug(this);    
    // ...    
  };    
  // private function for debugging  
  //“debug”方法不能从外部闭包进入,因此对于我们的实现是私有的。  
  function debug($obj) {    
    if (window.console && window.console.log)    
      window.console.log('hilight selection count: ' + $obj.size());    
  };    
//  ...    
})(jQuery); 
Javascript 相关文章推荐
prototype 学习笔记整理
Jul 17 Javascript
基于jquery的Repeater实现代码
Jul 17 Javascript
用javascript删除当前行,添加行(示例代码)
Nov 25 Javascript
javascript常用代码段搜集
Dec 04 Javascript
web前端设计师们常用的jQuery特效插件汇总
Dec 07 Javascript
禁止按回车键提交表单的方法
Jun 11 Javascript
jQuery Mobile框架中的表单组件基础使用教程
May 17 Javascript
js判断所有表单项不为空则提交表单的实现方法
Sep 09 Javascript
javascript匀速动画和缓冲动画详解
Oct 20 Javascript
谈谈target=_new和_blank的不同之处
Oct 25 Javascript
防止页面url缓存中ajax中post请求的处理方法
Oct 10 Javascript
javascript设计模式 ? 解释器模式原理与用法实例分析
Apr 17 Javascript
javascript实现yield的方法
Nov 06 #Javascript
Javascript事件实例详解
Nov 06 #Javascript
zTree插件之多选下拉菜单实例代码
Nov 06 #Javascript
Jquery ajax执行顺序 返回自定义错误信息(实例讲解)
Nov 06 #Javascript
Js参数值中含有单引号或双引号问题的解决方法
Nov 06 #Javascript
浅析Js中的单引号与双引号问题
Nov 06 #Javascript
表单元素与非表单元素刷新区别详细解析
Nov 06 #Javascript
You might like
PHP MemCached高级缓存配置图文教程
2010/08/05 PHP
深入apache host的配置详解
2013/06/09 PHP
php断点续传之如何分割合并文件
2014/03/22 PHP
php实现获取局域网所有用户的电脑IP和主机名、及mac地址完整实例
2014/07/18 PHP
php实现监控varnish缓存服务器的状态
2014/12/30 PHP
php截取字符串函数分享
2015/02/02 PHP
php中使用gd库实现下载网页中所有图片
2015/05/12 PHP
PHP判断是否连接上网络的方法
2015/07/01 PHP
JavaScript在IE和Firefox(火狐)的不兼容问题解决方法小结
2010/04/13 Javascript
aspx中利用js实现确认删除代码
2010/07/22 Javascript
在页面上用action传递参数到后台出现乱码的解决方法
2013/12/31 Javascript
js判断数据类型如判断是否为数组是否为字符串等等
2014/01/15 Javascript
js判断游览器类型及版本号的代码
2014/05/11 Javascript
使用mouse事件实现简单的鼠标经过特效
2015/01/30 Javascript
JavaScript实现SHA-1加密算法的方法
2015/03/11 Javascript
JS回调函数基本定义与用法实例分析
2017/05/24 Javascript
js学习总结之DOM2兼容处理this问题的解决方法
2017/07/27 Javascript
使用百度地图实现地图网格的示例
2018/02/06 Javascript
[01:13:18]Secret vs Infamous 2019国际邀请赛淘汰赛 败者组 BO3 第一场 8.23
2019/09/05 DOTA
python使用beautifulsoup从爱奇艺网抓取视频播放
2014/01/23 Python
Python装饰器实现几类验证功能做法实例
2017/05/18 Python
浅谈django 重载str 方法
2020/05/19 Python
python3 循环读取excel文件并写入json操作
2020/07/14 Python
opencv python 对指针仪表读数识别的两种方式
2021/01/14 Python
分享8款纯CSS3实现的搜索框功能
2017/09/14 HTML / CSS
HTML5之语义标签介绍
2016/07/07 HTML / CSS
Sahajan美国:阿育吠陀护肤品牌
2021/01/09 全球购物
行政经理岗位职责
2013/11/09 职场文书
工作表现自我评价
2014/02/08 职场文书
党员政治学习材料
2014/05/14 职场文书
后进基层党组织整改方案
2014/10/25 职场文书
2015年员工工作表现评语
2015/03/25 职场文书
歌咏比赛主持词
2015/06/29 职场文书
小学三年级语文教学反思
2016/03/03 职场文书
fastdfs+nginx集群搭建的实现
2021/03/31 Servers
如何解决.cuda()加载用时很长的问题
2021/05/24 Python