吕神的自我修养

jquery文字特效限制内容列表字符长度或文字个数

在网站项目中为了保证页面的美观，对于一些标题特别长的标题都习惯截取前N个字符，然后加上“……”。

一般处理的时候直接由服务器程序来截取文字，这样生产的html中标题文字不全，会一定程度的影响网站的seo优化。

我们也也可考虑在网站的前端，用过js脚本来截取字符。这样在html中输出的嗨是全部标题，不影响网站的seo优化。又能起到美观的作用。

下面就是一个用jquery写的文字截取。希望对大家能有所帮助。
用jquery文字特效限制内容列表字符长度或文字个数

<script type="text/javascript">
    $(document).ready(function() {
        var arrLinks = $(".ranklist a");
        arrLinks.each(function() {
            var s = $(this).text(),
            l = $(this).text().length,
            n = 18; //设置字符长度为18个 
            if (l > n) {
                //文本所有内容用a标签的title属性提示文本全部内容
                $(this).attr("title", s);
                s = $(this).text(s.substring(0, n) + "...");
            }
        });
    });
</script>

核心部分
在线演示地址：http://demo.lrxin.com/jquery/text/jQuery%cf%de%d6%c6%ce%c4%d7%d6%b8%f6%ca%fd/

下载地址：http://pan.baidu.com/share/link?shareid=1454481964&uk=1010090726

封装成jquery插件。

/**
 * $.txtCur();
 * @charset utf-8
 * @extends jquery.1.8.3
 * @example
 * $('.info').txtCur({n:50});
 * $('.info').txtCur({n:50,z:'...',isTitle:1});
 */
(function($){   
    $.fn.extend({     
         txtCur: function(options) {   
		    //默认参数
            var defaults = {
			     /**截取长度 */
                 n:60, 
				 /*结尾添加字符*/
                 z:'...' ,
				 /*是否在标签上 添加 title 属性*/
				 isTitle :  true
               			 
            }        
            var options = $.extend(defaults, options);   
            return this.each(function(){
			    var o = options;   
                var $this = $(this);				
               	var s = $this.text(),
				l = $this.text().length,
				n = o.n; //设置字符长度为18个 
				if (l > n) {
					//文本所有内容用a标签的title属性提示文本全部内容
					if(o.isTitle) {$(this).attr("title", s);}
					s = $this.text(s.substring(0, n) + o.z);
				}
				/**/
 
            });   
        }   
    });   
       
})(jQuery);

jQuery的插件可实现右侧固定区块随滚动条滚动而滚动

jQuery的插件可实现右侧固定区块随滚动条滚动而滚动，适合网站右侧广告和推荐内容的展示。

使用方法：

1.引用样式文件css/lrtk.css

2.引用jquery的库文件js/jquery.js

3.引用效果的具体js代码文件js/js.js复制至html文件中。

4.将class为fixed的div的内容复制到您的html文件

预览效果：http://d.lanrentuku.com/down/js/piaofu-949/

下载地址：http://www.lanrentuku.com/js/d949.zip

下载地址2：