JQuery插件开发入门(原创)
作者：余超 EMail：yuchao86@gmail.com
这个月，因为一些工作上的需要重新开始以前用过的JQuery开发，而最后选择采用了插件开发，对于JQuery初学者来说，开发JQuery插件是一个高级的话题。
JQuery插件的开发一种是类级别的给JQuery添加新的全局函数，另一种是对象级别的给JQuery对象添加方法。
先给大家展示一下具体的开发环境：
[yuchao@yuchao-Latitude-E5410 ext]$pwd
/opt/lampp/htdocs/jquery/ext
[yuchao@yuchao-Latitude-E5410 ext]$ls
demo.html jquery-1.6.4.min.js jquery.yuchao.js style.css ui
[yuchao@yuchao-Latitude-E5410 ext]$
另外在demo.html中引入Jquery插件：
<script type="text/javascript" src="jquery-1.6.4.min.js"></script>
如下加入自己开发的插件jquery.yuchao.js文件：
<script type="text/javascript" src="jquery.yuchao.js"></script>
<link rel="stylesheet" type="text/css" href="style.css" />
1 添加一个新的全局函数，可采用如下定义，使用JQuery.extend(object),
/*
*http://jquery.com/
*contact:yuchao86@gmail.com
*yuchao first extend
*/
$.extend({
add:function(a,b){return a+b;},
sub:function(a,b){return a-b;},
mut:function(a,b){return a*b;},
div:function(a,b){return a/b;}
});
如上扩展还有其他写法，使用$.extend(object)也行，
调用时候写为：
$.add(15,10); //return 25
可以写为JQuery.myPlugin = {Object}
调用时采用的方法：
$.myPlugin.add(12，34);
$.myPlugin.mut(3，5);
使用命名空间可以解决插件冲突，
2、对象级别的插件开发如下的两种形式
没有插件名称的：
(function($){
$.fn.extend({
pluginName:function(opt,callback){
// Our plugin implementation code goes here.
}
})
})(JQuery);
有插件名称的：
(function($) {
$.fn.pluginName = function() {
// Our plugin implementation code goes here.
};
})(JQuery);
上面定义了一个JQuery函数,形参是$，函数定义完成之后,把JQuery这个实参传递进去.立即调用执行。
这样的好处是,我们在写JQuery插件时,也可以使用$这个别名,而不会与prototype引起冲突.
fn 是什么东西呢。查看JQuery源代码，就不难发现。
JQuery.fn = JQuery.prototype = {
init: function( selector, context ) {//....
//......
};
JQuery.fn = JQuery.prototype...
JQuery是一个封装得非常好的类，比如我们用语句$("#inputtags")会生成一个JQuery类的实例。
JQuery.fn.extend(object); 对JQuery.prototype进得扩展，就是为JQuery类添加“成员函数”。
比如我们要开发一个插件，做一个特殊的编辑框，当它被点击时，便alert当前编辑框里的内容。可以这么做：
/*
*http://jquery.com/
*contact:yuchao86@gmail.com
*yuchao first fn extend
*/
$.fn.extend({
clickAlert:function(){
$(this).click(function(){
alert($(this).val());
});
}
});
在html文件中使用$("#input1").clickAlert();便可以调用，便实现了扩展，每次被点击时它会先弹出目前编辑里的内容。
到此为止，插件开发完成，实际工作中有具体的插件开发很复杂，这里只是一个简单的demo版本。
希望大家多多拍砖，多多指点。
参考官方网站文章：
http://jquery.com/
http://docs.jquery.com/Plugin