插件基础篇3：jquery 插件开发备注

以前针对DOM元素的插件(即$.fn.)存临时数据都加在当前元素上建个特殊的属性来存,(JQ内部直接也搞这样的)

今天发现其实JQ自己早就有对这个临时数据的存储方法: 

$("dom").data(“mydata”,"this is data");还有就是插件开发的时候我们经常要给插件添加方法,其实就用JS内部添加方法的方法即可 

this.myfn=function(){} 

下面给上一个显示部分文字的插件的源码: 

(类似CSS的text-overflow,但本插件你需要提供显示几个字,用于精确控制显示数量) 

复制代码代码如下:

/** 
* demo: 
* 1.$("#limittext").limittext(); 
* 2.$("#limittext").limittext({"limit":1}); 
* 3.$("#limittext").limittext({"limit":1,"fill":"(部分隐藏)","fillid":"aaa"}); 
* 4.$("#limittext").limittext({"limit":1,"fill":"(部分隐藏)","fillid":"aaa"}).limit(10); * 5.$("#limittext").limittext({"limit":1,"fill":"(部分隐藏)","fillid":"aaa"}).limit('all'); 
* @param {Object} opt 
* @author Lonely * @link http://liushan.net 
*/ 
jQuery.fn.extend({ 
limittext:function(opt){ 
opt=$.extend({ 
"limit":30, 
"fill":"...", 
"fillid":null 
},opt); 
var $this=$(this); 
var body=$(this).data('body'); 
if(body==null){ 
body=$this.html(); 
$(this).data('body',body); 
} 
this.limit=function(limit){ 
if(body.length<=limit||limit=='all') 
var showbody=body; 
else{ 
if(opt.fillid==null) 
var showbody=body.substring(0,limit)+opt.fill; 
else 
var showbody=body.substring(0,limit)+"<span id='"+opt.fillid+"'>"+opt.fill+"<span>"; 
} 
$(this).html(showbody); 
} 
this.limit(opt.limit); 
return this; 
} 

});