jQuery实现长文本收缩展开插件
大家都知道,很多网站都有那种把较长文本收缩起来,只显示一小部分,后面有个展开/收缩按钮,点击可切换全部显示和只显示一小部分状态。 将要实现效果如下: 说句实话,这是一个简单得不能再简单的东西了,我也用Js实现功能(写死在每个页面),可我有十多个页面要用到这东西,就想着把它封装成插件,可我又从来没写过Js插件,项目要得很紧,也没时间去研究,所有就在百度上找看看有没有现成的。 结果找了好多都不是这种效果,到最后好不容易找了一个呢,是国外的,效果也能实现,不过有点小瑕疵。 1.因为作者是老外,所以分割文字时他是在指定的切割位置向后搜索,直到空格时才分割。因为英文单词是不能分割的,而单词间是以空格来区分的。这个用于中文的话就有问题,比如上图那个的文本,没一个空格的。 2.每展开并收缩一次,就会产生一个空的连接标签,虽然界面上看不到,但总觉得不爽。 3.那老外把收缩时的的标志省略号“...”写在展开连接里面的,不像上图是在文本尾部,这样就只能把连接和文本紧挨着,不然就很明显的看到省略号是在连接内。 因为又找不到其他的,一看那个JQuery插件代码也不是太多,所以就试着改一下。 好了,废话少说,直接贴代码。一个是未修改的源插件代码,一个是我改过的代码。 源插件代码(我只是格式化了),文件名:jquery.truncatable.js View Code 1 (function($) { 2 $