一、
一般情況下，HTML字符串過長時都會將超過的部分隱藏點，方法如下：
設置CSS：
.ellipsis-type{
max-width: 50px; //顯示寬度
white-space: nowrap; //文本不換行。
overflow: hidden; //超過部分隱藏
text-overflow: ellipsis; //超過部分用...代替
cursor: pointer; //鼠標設置(不是必須)
}
如果要查看整個字符串，可以引用popover
<script src="/static/common/js/popover.js"></script>
<tr class='file_name'>
<td class="ellipsis" data-toggle="popover" data-content="{{ your value}}" data-placement="bottom" data-container="body" >your text</td>
</tr>
二、
上面是通過CSS隱藏末端字符串。如果末端字符串有參考價值，可以通過js將字串中間或前部用特定字符代替。
$(".file_name").each(function(){ //遍歷file_name中的每個子元素
var v = $(this).children('.ellipsis').text();
if (v.length > 50)
{
// 用V的前20個字符+"......"+后15個字符代替V
var new_value = v.substring(0,20)+'......'+v.substring(v.length-15,v.length);
$(this).children('.name').text(new_value); //設置新的text()
}
});
---------------------
作者：carrey_0612
來源：CSDN
原文：https://blog.csdn.net/carrey_0612/article/details/80654960
版權聲明：本文為博主原創文章，轉載請附上博文鏈接！