如何用jquery自定義一個類?(demo參考)
/*簡單使用*/
(function($){
//el操縱對象,option屬性值
$.love = function(el,option){
var lo = $(el);
var lo.vars = $.extend({},$.love.default ,option); //合並成新對象,則是新的屬性列表
//定義其他屬性
......
var method = {};
//私有方法,私有方法之間可互相調用
method={
functionA: function() {...},
functionB: function() {...},
functionC: function() {...},
...
}
//公有方法(特權方法),供類外調用
this.publicFunction = function(a,b,c){
....
/*調用私有函數*/
method.functionA();
...
}
...
}
//可設置默認屬性
$.love.default = {
option1:...,
option2:...,
....
}
})(jQuery);
/*類外調用*/
var a = new $.love("#id",{title:"name",age:12,...});
a.publicFunction(a,b,c);
/*相對高級點*/
(function($){
//el操縱對象,option屬性值
$.love = function(el,option){
var lo = $(el);
var lo.vars = $.extend({},$.love.default ,option); //合並成新對象,則是新的屬性列表
//定義其他屬性
......
var method = {};
$.data(el, "love", lo); //在元素上存放數據,包括lo的所有屬性,方法
//私有方法,私有方法之間可互相調用
method={
functionA: function() {...},
functionB: function() {...},
functionC: function() {...},
...
}
//公有方法(特權方法),供類外調用
lo.pfunctionA = function(){
/*調用私有函數*/
method.functionA();
},
lo.pfunctionB = function(){...},
...
}
//可設置默認屬性
$.love.default = {
option1:...,
option2:...,
....
}
$.fn.love(option){
var $this = $(this);
if( $this.data('love')===undefined){
new $.love(this,option);
}else{
var love = $this.data('love'); //直接使用類中的函數等
love.pfunctionA();
}
}
})(jQuery);
$ ==> "$ "就是 jQuery 對象的引用,等於"jQuery "
(function(){}) ==>模仿塊級作用域
$.xxx ==>針對 jQuery 對象添加方法(我的理解)
$.fn.xxx ==》針對元素添加方法(我的理解)
