Javascript 如何检测文本区域输入中的换行符？

How to detect line breaks in a text area input?

提问by Dave Haigh

What is the best way to check the text area value for line breaks and then calculate the number of occurrences, if any?

检查换行符的文本区域值然后计算出现次数（如果有）的最佳方法是什么？

I have a text area on a form on my webpage. I am using JavaScript to grab the value of the text area and then checking its length.

我的网页上的表单上有一个文本区域。我正在使用 JavaScript 来获取文本区域的值，然后检查其长度。

Example

例子

enteredText = textareaVariableName.val();
characterCount = enteredText.length; // One line break entered returns 1

If a user enters a line break in the text area my calculation above gives the line break a length of 1. However I need to give line breaks a length of 2. Therefore I need to check for line breaks and the number of occurrences and then add this onto the total length.

如果用户在文本区域输入换行符，我上面的计算给出的换行符长度为 1。但是我需要将换行符的长度设为 2。因此我需要检查换行符和出现次数，然后将其添加到总长度上。

Example of what I want to achieve

我想要实现的示例

enteredText = textareaVariableName.val();
characterCount = enteredText.length + numberOfLineBreaks;

---

---

My solution before asking this question was the following:

在问这个问题之前，我的解决方案如下：

enteredText = textareaVariableName.val();
enteredTextEncoded = escape(enteredText);
linebreaks = enteredTextEncoded.match(/%0A/g);
(linebreaks != null) ? numberOfLineBreaks = linebreaks.length : numberOfLineBreaks = 0;

I could see that encoding the text and checking for %0Awas a bit long-winded, so I was after some better solutions. Thank you for all the suggestions.

我可以看到对文本进行编码和检查%0A有点冗长，所以我想要一些更好的解决方案。谢谢你的所有建议。

回答by beeglebug

You can use matchon the string containing the line breaks, and the number of elements in that array should correspond to the number of line breaks.

您可以match在包含换行符的字符串上使用，并且该数组中的元素数应对应于换行符的数量。

enteredText = textareaVariableName.val();
numberOfLineBreaks = (enteredText.match(/\n/g)||[]).length;
characterCount = enteredText.length + numberOfLineBreaks;

/\n/gis a regular expression meaning 'look for the character \n(line break), and do it globally (across the whole string).

/\n/g是一个正则表达式，意思是“查找字符\n（换行符），并在全局范围内（在整个字符串中）进行查找” 。

The ||[]part is just in case there are no line breaks. Match will return null, so we test the length of an empty array instead to avoid errors.

该||[]部分是为了以防万一没有换行符。Match 将返回null，因此我们改为测试空数组的长度以避免错误。

回答by Pointy

Here's one way:

这是一种方法：

var count = text.length + text.replace(/[^\n]/g, '').length;

Alternatively, you could replace all the "naked" \ncharacters with \r\nand then use the overall length.

或者，您可以替换所有“裸”\n字符，\r\n然后使用总长度。

回答by Elias Van Ootegem

I'd do this using a regular expression:

我会使用正则表达式来做到这一点：

var inTxt = document.getElementById('txtAreaId').value;
var charCount = inTxt.length + inTxt.match(/\n/gm).length;

where /\n/matches linebreaks (obviously), gis the global flag. mstands for mult-line, which you evidently need in this case...
Alternatively, though as I recall this is a tad slower:

其中/\n/匹配换行符（显然）g是全局标志。m代表多行，在这种情况下你显然需要......
或者，虽然我记得这有点慢：

var charCount = inTxt.length + (inTxt.split("\n").length);

EditJust realized that, if no line breaks are matched, this will spit an error, so best do:

编辑刚刚意识到，如果没有匹配的换行符，这将引发错误，所以最好这样做：

charCount = intTxt.length + (inTxt.match(/\n/) !== null ? inTxt.match(/\n/gm).length : 0);

Or something similar...

或者类似的东西...

回答by Peter

For new JS use encodeURI(), because escape()is deprecated in ECMAScript 1.5.

对于新的 JS 使用encodeURI()，因为escape()在 ECMAScript 1.5 中已弃用。

Instead use:
enteredText = textareaVariableName.val(); enteredTextEncoded = encodeURI(enteredText); linebreaks = enteredTextEncoded.match(/%0A/g); (linebreaks != null) ? numberOfLineBreaks = linebreaks.length : numberOfLineBreaks = 0;

而是使用：
enteredText = textareaVariableName.val(); enteredTextEncoded = encodeURI(enteredText); linebreaks = enteredTextEncoded.match(/%0A/g); (linebreaks != null) ? numberOfLineBreaks = linebreaks.length : numberOfLineBreaks = 0;