Javascript / Jquery技术：paginate fixed-size textarea with overflow：hidden

Question

我有一个用户输入<textarea id='input_text'>元素，带有以下CSS：

#input_text{ 
    height:200px; 
    overflow:hidden;  
    border-width:0;
    background-color:transparent;
}

'溢出：隐藏'的主要原因是避免在textarea满时弹出的丑陋滚动条。相反，我希望当textarea变满时发生分页。实现这个的最佳方法是什么？我在想javascript / jquery，但不确定如何。

附加说明：当达到textarea结束时，分页自动发生（新页面），如果用户退格，或者点击指向它的链接（返回第1页），页面会切换回（旧页面）。 / p>

不期待完整的解决方案，但一些有用的提示对我来说会派上用场（也可能是未来的编码员）。谢谢。

Answer 1

文本区域的分页是一个可怕的想法。如果我的评论太长，我不应该通过多个页面来阅读它。

我选择了http://plugins.jquery.com/project/TextAreaResizer，这是StackOverFlow在其文本区域使用的插件。它允许用户随意扩展textarea。

Answer 2

我会做类似的事情：

• 在keyup事件中检查scrollHeight是否大于textarea的高度。
• 如果删除文本区域中的文本并将其存储在数组中。此数组的值将构成您的“页面”。
• 然后，您需要构建一些UI以在页面中向后和向前导航。

此解决方案的“有趣”部分是如何在中间添加或删除某些内容时重新流动页面。

Answer 3

jQuery.elastic插件可以满足您的需求。当更多文本输入时，它会垂直拉伸文本区域。