文字超出显示省略号(css与js方法)
分类: 解决问题 5674 7
第一种给出固定宽度,结合css样式控制:
overflow: hidden;//超出隐藏
white-space: nowrap;//让文字不换行显示
text-overflow: ellipsis;//文本超出显示省略号
第二种通过js方法实现,下面例子通过给Object原型追加一个属性实现:
Object.prototype.ellipsis = function( length ){
var str = '';
for( var i = 0; i < this.innerHTML.length; i++ ){
if( this.innerHTML.length > length ){
str = this.innerHTML.substring( 0 , length ) + '...';
this.innerHTML = str;
}
}
}
第三种jQuery方法:
function ellipsis( obj , length ){
var str = '';
obj.each(function(){
if( obj.text().length > length ){
str = obj.text().substring(0 , length) + '...';
obj.text( str );
}
});
}
共 7 条评论关于 “文字超出显示省略号(css与js方法)”