计算没有jQuery的HTML textarea中显示的行数（不是换行符）？

Question

  

可能重复：
  How to get number of rows in <textarea >?

我有一个textarea，我在其中写7 lines只有2 new line character，如下所示，想象下面的代码框是textarea，只有输入密钥的两倍被按下了。

 A text box, text field or text entry box is a kind of widget used when building
 a graphical user interface (GUI). A text box purpose is to allow the user to
 input text information to be used by the program.
 User-interface guidelines recommend a single-line text box when only one line of
 input is required, and a multi-line text box only if more than one line of input
 may be required.
 Non-editable text boxes can serve the purpose of simply displaying text.

如果现在textarea line count为n，则在写完更多行之后。如何计算n？

的值

在回答问题之前请说清楚。我不想计算我的文本中有多少new line characters像这样。的 How to get the number of lines in a textarea?

我想将行数计算为 Microsoft Word 从段落中计算它。

请不要jQuery ...

Answer 1

你可以尝试一下这个。我到目前为止没有测试过，但我记得这应该可以正常工作。

var lineHeight = document.getElementById("yourTextarea").style.lineHeight;
var scrollHeight = document.getElementById("yourTextarea").scrollHeight;
document.getElementById("yourTextarea").style.height = scrollHeight; // this is just for showing purposes
var numLines = Math.floor( scrollHeight / lineHeight );

这应该是我认为最简单的方式。

修改

所以答案就这么简单：D

首先使shure为textarea提供 cols

的值

现在检查出来=

<textarea id="mytext" cols="10" rows="12">
</textarea>
<input type="button" value="Count Rows" onclick="countRows();"/>
<script type="text/javascript">
function countRows() {
    var stringLength = document.getElementById("mytext").value.length;
    var count = Math.ceil( stringLength / document.getElementById("mytext").cols ); 
    // just devide the absolute string length by the amount of horizontal place and ceil it
    alert( count );
}
</script>

现在这应该正常工作。

<强>更新

您还可以确保删除所有“新行”元素或仅删除最后一个字符，如果它是字符串中的“新行”，则获取长度。这样就不会计算出不需要的额外行数了。

还要确保不设置文本框的“宽度”！这将导致连续的文本比“cols”的值更远。这样，“count”值将为您提供行数，如果最大行宽度为cols值。所以使用cols属性设置文本框宽度的唯一方法。

更新2

我认为如果你想要一种非错误的方式，就无法使用PHP或jQuery。

另外，第二种解决方案只是一种快速而肮脏的方式。你必须编写一个逻辑来检查每个单词是否长于可用宽度，并检查每一行是否由于空间不足而放入下一行的单词。

这将需要一些逻辑技能，由于不活动，我暂时不会编写代码。

如果您希望我发布完整的Javascript，PHP或jQuery解决方案，请告诉我们。 （我认为没有任何理由不使用jQuery）