テキストエリアの現在の行と列番号を表示

Question

私はweb-appでファイル編集インターフェースを作っています。ファイル内容のテキストエリアがあります。

テキストエリアにフォーカスがあるときに、カーソルの位置、つまり行番号と列を出力します。これは、エラーメッセージが通常行番号を生成するために便利です。

質問は、どのように私はテキストエリア内のカーソルの位置を把握するのですか？ 私はプロトタイプライブラリを使用しています。多分すでに解決策がありますか？

私は、これらの高度なウィジェットによって提供されるテキストエリア用の素晴らしいツールバーには本当に興味がありません。

Answer 1

あなたはこれらの2つのリンクをチェックアウトすることもできます。

は

http://www.dedestruct.com/2008/03/22/howto-cross-browser-cursor-position-in-textareas/^{[orginalソースはもはや存在しませんが、Webアーカイブの最新バージョンに変更されたリンクポイント]}

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

..あなたは選択肢（テキストのカーソルインデックス）を持っているので、改行でテキストを分割して行番号を取得することができます。おかげで、私はそれを試してみましょう

<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

行の先頭からインデックスを決定することによって、列を取得することができます。