jQuery下扩展插件和拓展函数的写法(匿名函数使用的典型例子)


Posted in Javascript onOctober 20, 2010

我选择了jQuery,最主要是它的思想“write less,do more",因为我是一个挑剔的人,以前写过的代码,会时不时翻出来,看看有没有可以精简,优化的地方。一来是对不断学习的推动,二来可以将新的思想,技术应用到里面去。
对于jQuery插件的写法,以前就有介绍过,网上也有很多例子。 这里简要地进行些写法,主要是简写的说明,见下列代码:
<script type="text/javascript" src="jquery-1.4.2.js"></script>

<script type="text/javascript"> 
//jQuery插件的写法(需要传入操作对象) 
;(function($) 
{ 
//PI_TestPlugIn为插件名称,也是插件的操作对象 
//为了不会与其它插件名重复,这里我使用PlugIn的缩写PI_来定义插件对象前缀 
$.fn.PI_TestPlugIn= 
{ 
//该插件的基本信息 
Info:{ 
Name: "TestPlugIn", 
Ver: "1.0.0.0", 
Corp: "Lzhdim", 
Author: "lzhdim", 
Date: "2010-01-01 08:00:00", 
Copyright: "Copyright @ 2000-2010 Lzhdim Technology Software All Rights Reserved", 
License: "GPL" 
}, 
//具有参数的函数对象,这里参数是一个对象,具有属性 
FunctionWithParams:function(paramObj) 
{ 
//使用参数,是否使用默认值 
var params = paramObj ? paramObj : new function(){ 
param1= "1"; 
param2= "2"; 
}; 
return this.Info.Name + ".FunctionWithParamObject"; 
}, 
//具有参数的函数对象,这里参数是一个变量 
FunctionWithParam:function(varparam) 
{ 
//使用参数,是否使用默认值 
var param = varparam ? varparam : null; 
return this.Info.Name + ".FunctionWithParam"; 
}, 
//不具有参数的函数对象 
FunctionWithOutParam:function() 
{ 
return this.Info.Name + ".FunctionWithOutParam"; 
} 
}; 
})(jQuery); 
//jQuery拓展函数的写法(不需要传入操作对象),即API函数 
;(function($) 
{ 
$.extend({ 
//PIF_TestExtendFunction为拓展函数的操作对象 
//为了不会与其它插件名重复,这里我使用PlugIn的缩写PI_来定义插件对象前缀 
PIF_TestExtendFunction: 
{ 
//该拓展函数的基本信息 
Info:{ 
Name: "TestExtendFunction", 
Ver: "1.0.0.0", 
Corp: "Lzhdim", 
Author: "lzhdim", 
Date: "2010-01-01 08:00:00", 
Copyright: "Copyright @ 2000-2010 Lzhdim Technology Software All Rights Reserved", 
License: "GPL" 
}, 
//具有参数的函数对象 
FunctionWithParams:function(paramObj) 
{ 
//使用参数,是否使用默认值 
var params = paramObj ? paramObj : { 
param1: "1", 
param2: "2" 
}; 
return this.Info.Name + ".FunctionWithParamObect"; 
}, 
//具有参数的函数对象,这里参数是一个变量 
FunctionWithParam: function (varparam) { 
//使用参数,是否使用默认值 
var param = varparam ? varparam : null; 
return this.Info.Name + ".FunctionWithParam"; 
}, 
//不具有参数的函数对象 
FunctionWithOutParam:function() 
{ 
return this.Info.Name + ".FunctionWithOutParam"; 
} 
} 
}); 
})(jQuery); 
$(function () 
{ 
//测试插件 
var params = 
{ 
param1: "3", 
param2: "4" 
}; 
alert($(this).PI_TestPlugIn.FunctionWithParams(params)); 
alert($.PIF_TestExtendFunction.FunctionWithOutParam()); 
}); 
</script>
Javascript 相关文章推荐
jquery 框架使用教程 AJAX篇
Oct 11 Javascript
javascript 混合的构造函数和原型方式,动态原型方式
Dec 07 Javascript
jQuery简单实现遍历数组的方法
Apr 14 Javascript
异步安全加载javascript文件的方法
Jul 21 Javascript
基于JS实现导航条flash导航条
Jun 17 Javascript
Vue.js教程之计算属性
Nov 11 Javascript
jQuery实现动态添加tr到table的方法
Dec 26 Javascript
xmlplus组件设计系列之列表(4)
Apr 26 Javascript
vue实现全匹配搜索列表内容
Sep 26 Javascript
在Vue中创建可重用的 Transition的方法
Jun 02 Javascript
JavaScript字符和ASCII实现互相转换
Jun 03 Javascript
Javascript实现鼠标移入方向感知
Jun 24 Javascript
JQuery 拾色器插件发布-jquery.icolor.js
Oct 20 #Javascript
Javascript技巧之不要用for in语句对数组进行遍历
Oct 20 #Javascript
来自国外的14个图片放大编辑的jQuery插件整理
Oct 20 #Javascript
理解Javascript_12_执行模型浅析
Oct 18 #Javascript
理解Javascript_11_constructor实现原理
Oct 18 #Javascript
关于js中window.location.href,location.href,parent.location.href,top.location.href的用法与区别
Oct 18 #Javascript
jQuery Validation实例代码 让验证变得如此容易
Oct 18 #Javascript
You might like
php数据访问之查询关键字
2016/05/09 PHP
laravel 事件/监听器实例代码
2019/04/12 PHP
php提高脚本性能的4个技巧
2020/08/18 PHP
IE iframe的onload方法分析小结
2010/01/07 Javascript
Whatever:hover 无需javascript让IE支持丰富伪类
2010/06/29 Javascript
用JQuery模仿淘宝的图片放大镜显示效果
2011/09/15 Javascript
jQuery性能优化28条建议你值得借鉴
2013/02/16 Javascript
JS中把字符转成ASCII值的函数示例代码
2013/11/21 Javascript
快速解决FusionCharts联动的中文乱码问题
2013/12/04 Javascript
js实现ArrayList功能附实例代码
2014/10/29 Javascript
javascript的push使用指南
2014/12/05 Javascript
JavaScript获取数组最小值和最大值的方法
2015/06/09 Javascript
基于jquery实现动态竖向柱状条特效
2016/02/12 Javascript
原生js三级联动的简单实现代码
2016/06/07 Javascript
AngularJS 中的Promise --- $q服务详解
2016/09/14 Javascript
Angular开发者指南之入门介绍
2017/03/05 Javascript
js制作简单的音乐播放器的示例代码
2017/08/28 Javascript
JS实现带导航城市列表以及输入搜索功能
2018/01/04 Javascript
解决Webpack 热部署检测不到文件变化的问题
2018/02/22 Javascript
使用p5.js临摹动态图片
2019/11/04 Javascript
keep-Alive搭配vue-router实现缓存页面效果的示例代码
2020/06/24 Javascript
vue 二维码长按保存和复制内容操作
2020/09/22 Javascript
nestjs返回给前端数据格式的封装实现
2021/02/22 Javascript
关于better-scroll插件的无法滑动bug(2021通过插件解决)
2021/03/01 Javascript
python实战之实现excel读取、统计、写入的示例讲解
2018/05/02 Python
python求最大连续子数组的和
2018/07/07 Python
Python函数any()和all()的用法及区别介绍
2018/09/14 Python
基于keras中的回调函数用法说明
2020/06/17 Python
python实现数学模型(插值、拟合和微分方程)
2020/11/13 Python
html5 Canvas画图教程(11)—使用lineTo/arc/bezierCurveTo画椭圆形
2013/01/09 HTML / CSS
Bootstrap File Input文件上传组件
2020/12/01 HTML / CSS
装修五一活动策划案
2014/01/23 职场文书
网络编辑岗位职责范本
2014/02/10 职场文书
公司户外活动总结
2014/07/04 职场文书
新娘婚礼答谢词
2015/09/29 职场文书
MySQL约束超详解
2021/09/04 MySQL