您的位置:首页 > Web前端 > JQuery

单行/多行文本溢出处理

2016-09-09 16:16 239 查看
单行文本溢出
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;

多行文本溢出
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;

jQuery实现
$(".content").each(function(i){
var $divH = $(this).height();
var $oP = $("p", $(this)).eq(0);
while($oP.outerHeight() > $divH){
$oP.text($oP.text().replace(/(\s)*([a-zA-Z0-9]+|\W)(\.\.\.)?$/, "..."))
}
});

jQuery截取固定字数
$(".content").each(function() {
    if ($(this).text().length > 50) {
    var str = $(this).text($(this).text().trim().substring(0, 50));//截取50个字符
        $(this).text($(this).text() + "…");
    }
});

 
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  jquery css css3 javascript