我有一个包含文本的div,其长度为任意且固定。超过一定长度(称之为L),文本将被截断且剩余部分不再可见(精确地说,范围[0,L)是可见的,范围[L,S)则不可见)。
我想要做的是通过仅计算div中可见字符的数量来找到文本的长度L。超出截断点的任何字符都应被忽略。
如若需要,我愿意使用第三方库,例如jQuery等,以完成这项工作!
我想要做的是通过仅计算div中可见字符的数量来找到文本的长度L。超出截断点的任何字符都应被忽略。
如若需要,我愿意使用第三方库,例如jQuery等,以完成这项工作!
这是我编写的一个用于修剪文本的函数:
function getTextThatFits(txt, w, fSize, fName, fWeight) {
if (fWeight === undefined)
fWeight = "normal";
var auxDiv = $("<div>").addClass("auxdiv").css ({
fontFamily : fName,
fontSize : parseInt(fSize) + "px",
position: "absolute",
height: "auto",
marginLeft : "-1000px",
marginTop : "-1000px",
fontWeight: fWeight,
width: "auto"
})
.appendTo($("body"))
.html(txt);
var ww = (auxDiv.width() + 1);
var str = txt;
if (ww > w)
{
var i = 1, p = 1, u = txt.length, sol = 0;
while (p <= u)
{
i = (p + u) >> 1;
str = txt.slice(0, i);
auxDiv.html(str);
ww = (auxDiv.width() + 1);
if (ww <= w) {
sol = i;
p = i + 1;
}
else u = i - 1;
}
str = txt.slice(0, sol);
}
$(".auxdiv").remove();
auxDiv.remove();
return str.length;
}
我正在使用二分查找来寻找适合特定宽度的文本。 为了使用该函数,您必须像这样调用它:
getTextThatFits(yourText, divWidth, fontSize, fontName, fontWeight=optional)
overflow: hidden
的 div 中可见的字符数量吗? - Rory McCrossan