TextAreaのカーソル選択範囲の取得

TextAreaでカーソルが選択した範囲とその内容を取得するには、ほとんどのブラウザでは、selectionStartとselectionEndのプロパティを読み込むだけで簡単です.しかし、IE 6-IE 8のtextarea要素にはこの2つの属性がないので、IEに独自のTextRangeオブジェクトを変更する必要があります.例は次のとおりです.

function getSelection(area) { 

  var selstart, selend, seltext;

  if (area.selectionStart) {

    selstart = area.selectionStart;

    selend = area.selectionEnd;

    seltext = area.value.substring(selstart, selend);

  } else {

    var range1 = document.selection.createRange();

    if (range1.parentElement() != area) return;

    var range2 = range1.duplicate();

    range2.moveToElementText(area);

    range2.setEndPoint('EndToEnd', range1);

    selstart = range2.text.length - range1.text.length;

    selend = selstart + range1.text.length;

    seltext = range1.text;

  }

  return {

    selstart: selstart,

    selend: selend,

    seltext: seltext

  };

}

そのうちrange 1.parentElement()==areaの判断が必要です.そうしないと、moveToElementTextという行のIEで「パラメータが無効」(Invalid argument)とエラーが発生します.インターネット検索では、TextRangeの修正で対象が焦点を当てることを保証しなければならないためだという.だから、私たちもareaを通じてfocus()はこの問題を避ける.
また、range 2を直接作成して終了位置を調整しようとすると、パラメータが無効なエラーも発生します.

......

var range2 = codearea.createTextRange();

range2.setEndPoint('EndToEnd', range1);

......

そこで上記では迂回的な方法でrange 2を作成していますが、IEという破れたものの問題が多いのは.
この方法は、旧バージョンIEにおいて、カーソルが行頭にある場合、得られるselstart位置は、前の行の行末位置であり、正確な値より2小さい(IEのtextarea改行は2文字rであることに注意).具体的な解決策は参考資料を見ることができる.
参考資料:
[1]  Finding selection start and end position in a textarea, in Internet Explorer [2]  How to get caret position in textarea? [3]  How to get the start and end points of selection in text area? [4]  IE's document.selection.createRange doesn't include leading or trailing blank lines [5]  Introduction to Range [6]  TextRange object - MSDN [7]  createTextRange method - MSDN [8]  moveToElementText method - MSDN [9]  setEndPoint method - MSDN [A]  parentElement method - MSDN [B]  Textareaカーソル位置に応じた文字挿入（IE，FF対応） [C]  TextRangeオブジェクトのsetEndPointメソッドとcompareEndPointメソッド