简体繁体 English

textarea中的自动换行符

[英]Automatic newline in textarea

原文 2010-06-25 03:03:19 4 2 javascript/ jquery/ html/ textarea/ word-wrap

Using jQuery, how can I make a textarea that automatically adds a new line when inserting text when the cursor is near the end. 使用jQuery，当光标接近结尾时，如何在插入文本时如何创建自动添加新行的文本区域。

The width of the textarea is dynamically done via CSS (eg, #myTextArea { width: 80%; } ) so I can't do anything like counting the characters in each line. textarea的宽度是通过CSS动态完成的（例如#myTextArea { width: 80%; } ），所以我无法像计数每一行中的字符那样做任何事情。

I don't need a non-JS solution since the content of the textarea is only ever seen by JavaScript anyways. 我不需要非JS解决方案，因为textarea的内容始终只能通过JavaScript看到。

2 个解决方案

You can get the calculated pixel width of the text area and the textarea's padding. 您可以获得计算出的文本区域的像素宽度和文本区域的填充。 You can look up the average (or mode, or whatever pleases you) horizontal width of your font. 您可以查找字体的平均水平宽度（或模式，或其他令人满意的水平）。 You can make a guess at the kerning. 您可以猜测字距调整。 See what I'm getting at? 明白我在说什么吗？ (hint: calculate the line length in characters) （提示：以字符为单位计算行长）

You mentioned counting characters, so I assume you already know how to do that. 您提到计数字符，所以我想您已经知道该怎么做。 :-) :-)

This is a really nasty problem to try and solve. 要解决这个问题确实很麻烦。 I'd be going down either 1 of 2 pahts. 我要去2泰铢之一。 1 just use the text area as is or 2 using a nice jQuery editor which makes the text look nice. 1只按原样使用文本区域，或者2使用漂亮的jQuery编辑器使文本看起来更漂亮。