首页 新闻 搜索 专区 学院

给定div宽高,插入一段长文本,如何用js来取到截断的位置使文本正好充满div

0
悬赏园豆:200 [待解决问题]

div宽高是100,100, 给的字符串是任意的很长的字符串,用原生js来取到该截断的位置,使截断位置
之前的字符串正好充满这个div。
文本的字体和大小可以获知。

我目前是用二分法来试探,就是插入一半,测一下插入的段落的offsetHeight,如还是超过100,则继
续截,否则添加下一半内容进来继续测试高度。但这种做好对DOM操作太多,性能太差。我觉得用字体
的宽度和行高去计算是不可行的。

跪求高人帮我解决一下这个问题。

问题补充:

我还要获取截断后半部分字符串啊。。

aotoYu的主页 aotoYu | 初学一级 | 园豆:2
提问于:2012-02-26 17:19
< >
分享
所有回答(9)
1

想不出什么办法来,不过,不太明白你的用处是什么,是否CSS中的 overflow:hidden; 可以满足你的需求?

在指定DIV宽高的情况下,这个属性可以确保内容不会超出和撑开DIV

丁学 | 园豆:18530 (专家六级) | 2012-02-26 18:38
0

楼上回答者姓名,跟我名字前两个字一样,让我回答我也这么回答?其实也不知道楼主需求,难道用js获取字的宽度和高度?

EveryDing | 园豆:198 (初学一级) | 2012-02-26 19:15

我真叫丁学……

支持(0) 反对(0) 丁学 | 园豆:18530 (专家六级) | 2012-02-26 19:30

@丁学: 我也真比你多一个字“书”

支持(0) 反对(0) EveryDing | 园豆:198 (初学一级) | 2012-02-28 09:13
0

你这的这个问题,好像不用截取吧,文字会自动换行的。

悟行 | 园豆:12346 (专家六级) | 2012-02-26 20:24
0

让文字自动隐藏就好了,多了的反正都不需要看到了,

<div style="overflow:hidden;"></div>

这样看看。

az235 | 园豆:8283 (大侠五级) | 2012-02-27 08:42

都说了不需要截取了,你还截取干嘛,要不你就只能计算文字宽和行高了

支持(0) 反对(0) az235 | 园豆:8283 (大侠五级) | 2012-02-27 13:34
0

同意楼上意见,使用overflow:hidden 和word-break:all-break 就不需要再去计算或获取内容的所占位置的高度与宽度了。。。

KivenRo | 园豆:1722 (小虾三级) | 2012-02-27 12:59

这样试一下吧,用截取字符串的方法做吧,固定好一个div中一共多少行,适当的设置行高,每行多少个字符,截取字符串时,一个汉字表示两个字符,其每行字符不超过DIV的宽度,这样就可以将剩下的部分截取出来了。同样,也可以加上以上的样式进行设置。。。

支持(0) 反对(1) KivenRo | 园豆:1722 (小虾三级) | 2012-03-02 22:40
0

其实,overflow:hidden;已经够用了,不知道楼主为什么有这样变态的需求?

如果说div的宽度和高度都确定,字体大小行距都确定,那么可以先知道这个div里面能装多少字符处滚动条,那么你就知道这个div里面可以刚好不出滚动条的值吧!哈哈

stevey | 园豆:335 (菜鸟二级) | 2012-02-27 13:08
0

难道是subString(0,300)这样。。。

卓玲 | 园豆:205 (菜鸟二级) | 2012-03-01 15:20
0

谢谢大家回复,我已经用js的二分法实现了。虽然有点麻烦,但截断位置找的很精确,而且性能也还行

aotoYu | 园豆:2 (初学一级) | 2012-03-07 18:52
0

楼主能把方法贡献出来吗?

周波斯 | 园豆:202 (菜鸟二级) | 2019-08-08 17:44
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册