Question

我试图找了很长时间的答案，但我没有找到任何答案。

我正在使用contentEditable div来精确地在210x297mm页面上写入文本。当页面结束时，javascript会添加下一个：

if(container.scrollHeight > container.clientHeight)
{
    page_number = page_number+1
    $('#editor').append('<div id="page_'+page_number+'" class="page" onkeyup="javascript:check_page(this);" contentEditable></div><div class="marginbottom"></div>');
    $("#page_"+page_number).attr("tabindex",-1).focus();
}

除非我在每个页面末尾的div中粘贴任何更长的文本，否则一切正常。然后只有部分文本出现，其余部分出现在div之外（因为'溢出：隐藏'是不可见的）。

是否有任何javascript / jquery方法来检测溢出的内容并将其移动到下一页（我没有找到它）或任何CSS样式，这将允许我分隔每个div内的文本？我已经读过CSS3多列，我需要做类似的操作，但要分隔行，而不是列。

Answer 1

我认为您最好不要使用overflow: hidden而是使用auto，并尝试使用JavaScript检测是否存在溢出，检查滚动高度。

在这种情况下，您可以动态地开始移动文本的一部分（可能逐字逐句），直到内容适合可用空间。

对于某些具体技术，请检查此帖子，例如：detect elements overflow using jquery

检测溢出内容

1 个答案: