如何截取字符串，使其在浏览器上显示相同长度？

如何实现如下功能？



乍一看是不是想到了直接通过substring截取，但是这样会面临一个问题：有的标题中有中文，有的标题中有字母数字，这样如果直接采用substring截取固定个数字符，浏览器上显示仍然会不整齐，这是因为浏览器上显示中文所占用的像素要多于字母和数字。采用此法截取后效果如下图：



如何解决问题呢？

通过正则表达式匹配字符串，得出真实长度，之后按照真实长度等比例进行截取：

（此在js中进行截取）

<script type="text/javascript">

var title="${v.title}";

var id="${v.id}";

var realLength=(title.replace(/[^\x00-\xff]/g,"**").length+1)/2

if(realLength>14){

title=title.substring(0,
14*(title.length/realLength))+"...";

}

$("#"+id).html(title);

//alert(realLength);

</script>