css:
.itm-word{
88%;
height: 2rem;
overflow:hidden;
text-overflow:ellipsis;
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:2; //只支持webkit浏览器
font-size: 0.75rem;
padding-top: 0.375rem;
color: #3d3d3d;
position:relative;
padding-left: 6%;
padding-right: 6%;
}
.zxx_text_overflow {
line-height: 1rem;
}
html:
<div class="itm-word">
<p class="zxx_text_overflow">
$!{product.prodName}
</p>
</div>
js:
$(".itm-word").each(function(e){
var divHeight = $(this).height();
var $p = $(this).find(".zxx_text_overflow");
//var $p = $("p", $(this)).eq(0);
while ($p.outerHeight() > divHeight) {
$p.text($p.text().replace("/(s)*([a-zA-Z0-9]+|W)(...)?$/", "..."));
};
});