jquery 插件开发备注


Posted in Javascript onAugust 27, 2010

今天发现其实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; 
} 
});
Javascript 相关文章推荐
用Javascript 获取页面元素的位置的代码
Sep 25 Javascript
jQuery UI 实现email输入提示实例
Aug 15 Javascript
jquery实现网页的页面平滑滚动效果代码
Nov 02 Javascript
理解JS绑定事件
Jan 19 Javascript
Bootstrap中文本框的宽度变窄并且加入一副验证码图片的实现方法
Jun 23 Javascript
使用vue.js实现checkbox的全选和多个的删除功能
Feb 17 Javascript
JavaScript使用atan2来绘制箭头和曲线的实例
Sep 14 Javascript
深入了解javascript 数组的sort方法
Jun 01 Javascript
生成无限制的微信小程序码的示例代码
Sep 20 Javascript
JS函数本身的作用域实例分析
Mar 16 Javascript
vue 在单页面应用里使用二级套嵌路由
Dec 19 Vue.js
vue使用echarts画组织结构图
Feb 06 Vue.js
Jquery + Ajax调用webService实例代码(asp.net)
Aug 27 #Javascript
JavaScript使用过程中需要注意的地方和一些基本语法
Aug 26 #Javascript
ExtJs GridPanel简单的增删改实现代码
Aug 26 #Javascript
javascript oop开发滑动(slide)菜单控件
Aug 25 #Javascript
JavaScript初学者需要了解10个小技巧
Aug 25 #Javascript
离开页面时检测表单元素是否被修改,提示保存的js代码
Aug 25 #Javascript
js中判断控件是否存在
Aug 25 #Javascript
You might like
php实现的仿阿里巴巴实现同类产品翻页
2009/12/11 PHP
PHP浮点数的一个常见问题
2016/03/10 PHP
浅谈PHP中静态方法和非静态方法的相互调用
2016/10/04 PHP
JavaScript中void(0)的具体含义解释
2007/02/27 Javascript
[JSF]使用DataModel处理表行事件的实例代码
2013/08/05 Javascript
jQuery控制iFrame(实例代码)
2013/11/19 Javascript
JS数组去重与取重的示例代码
2014/01/24 Javascript
Windows系统中安装nodejs图文教程
2015/02/28 NodeJs
Windows系统下使用Sublime搭建nodejs环境
2015/04/13 NodeJs
js实现键盘Enter键提交表单的方法
2015/05/27 Javascript
JavaScript数组对象赋值用法实例
2015/08/04 Javascript
RequireJS多页面应用实例分析
2016/06/29 Javascript
js 中获取制定的cook信息实现方法
2016/11/19 Javascript
jQuery遮罩层实例讲解
2017/05/11 jQuery
Node.js使用Express.Router的方法
2017/11/14 Javascript
vue实现的树形结构加多选框示例
2019/02/02 Javascript
layui表单提交到后台自动封装到实体类的方法
2019/09/12 Javascript
angular组件间通讯的实现方法示例
2020/05/07 Javascript
el-table树形表格表单验证(列表生成序号)
2020/05/31 Javascript
Mac OS X10.9安装的Python2.7升级Python3.3步骤详解
2013/12/04 Python
Python基础教程之浅拷贝和深拷贝实例详解
2017/07/15 Python
python实现生命游戏的示例代码(Game of Life)
2018/01/24 Python
Python面向对象类继承和组合实例分析
2018/05/28 Python
基于python实现聊天室程序
2018/07/27 Python
关于python3中setup.py小概念解析
2019/08/22 Python
Win10下python 2.7与python 3.7双环境安装教程图解
2019/10/12 Python
Python如何优雅删除字符列表空字符及None元素
2020/06/25 Python
python解包用法详解
2021/02/17 Python
2014世界杯球队球队口号
2014/06/05 职场文书
办公室个人总结
2015/02/28 职场文书
英语教师求职信范文
2015/03/20 职场文书
科技馆观后感
2015/06/08 职场文书
信息技术课教学反思
2016/02/23 职场文书
Python实现Telnet自动连接检测密码的示例
2021/04/16 Python
详解盒子端CSS动画性能提升
2021/05/24 HTML / CSS
css中有哪些方式可以隐藏页面元素及区别
2022/06/16 HTML / CSS