显示textarea的当前行和列号

Question

我正在我的网络应用程序中创建一个文件编辑界面,我有一个文件内容的textarea.

当textarea被聚焦时,我想输出光标的位置,即行号和列:这很有用,因为错误消息通常会产生一个行号.

问题是:我如何计算光标在textarea中的位置？我正在使用原型库.也许已经有了解决方案？

我对textarea的花哨工具栏并不感兴趣,这些工具栏是由那些高级小部件提供的.

Answer 1

当我想要textarea的当前行号和textarea的当前列时，我是这样解决的：

<textarea  onkeyup="getLineNumberAndColumnIndex(this);" onmouseup="this.onkeyup();" >
</textarea>

function getLineNumberAndColumnIndex(textarea){
     var textLines = textarea.value.substr(0, textarea.selectionStart).split("\n");
     var currentLineNumber = textLines.length;
     var currentColumnIndex = textLines[textLines.length-1].length;
     console.log("Current Line Number "+ currentLineNumber+" Current Column Index "+currentColumnIndex );
  }

Answer 2

您可以查看以下2个链接:

http://www.dedestruct.com/2008/03/22/howto-cross-browser-cursor-position-in-textareas/ ^{[原始源不再存在,修改后的链接指向最新版本的网络档案]}

https://developer.mozilla.org/En/DOM:Selection

..如果你有一个选择(文本中的光标索引),你可以按换行分割你的文字,从而得到行号.您可以通过从行的开头确定索引来获取列