如何获取文本区域中的行数?

新手上路,请多包涵

我想要的是计算文本区域中的行数,例如:

 line 1
line 2
line 3
line 4

应该数到 4 行。基本上按一次回车就会转到下一行

以下代码不起作用:

 var text = $("#myTextArea").val();
var lines = text.split("\r");
var count = lines.length;
console.log(count);

无论有多少行,它总是给出“1”。

原文由 Ali 发布,翻译遵循 CC BY-SA 4.0 许可协议

阅读 1.5k
2 个回答

我已经将 lines 和 lineCount 方法实现为 String 原型:

 String.prototype.lines = function() { return this.split(/\r*\n/); }
String.prototype.lineCount = function() { return this.lines().length; }

显然,split 方法不会在 IE9 中计算字符串末尾的回车符和/或换行符(或文本区域的 innerText 属性),但它会在 Chrome 22 中计算它,从而产生不同的结果。

到目前为止,当浏览器不是 Internet Explorer 时,我已经通过从行数中减去 1 来解决这个问题:

 String.prototype.lineCount = function() { return this.lines().length - navigator.userAgent.indexOf("MSIE") != -1); }

希望有人有更好的 RegExp 或其他解决方法。

原文由 hector-j-rivas 发布,翻译遵循 CC BY-SA 3.0 许可协议

使用“\n”或“\r”的问题是它只计算返回的次数,如果你有一行很长它可以换行然后它不会被算作一个新行。这是获取行数的另一种方法 - 所以它可能不是最好的方法。

编辑(感谢亚历克斯):

脚本

$(document).ready(function(){
 var lht = parseInt($('textarea').css('lineHeight'),10);
 var lines = $('textarea').attr('scrollHeight') / lht;
 console.log(lines);
})

更新:这里有一个更彻底的答案: https ://stackoverflow.com/a/1761203/145346

原文由 Mottie 发布,翻译遵循 CC BY-SA 3.0 许可协议

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题