参考:
https://developer.mozilla.org/en-US/docs/Web/API/Window/getSelection
https://developer.mozilla.org/en-US/docs/Web/API/Selection/getRangeAt
https://developer.mozilla.org/en-US/docs/Web/API/Selection/addRange
MDNのこれらの不安定APIことを示唆しています。これは、IE9 +、Googleのは、Firefoxと互換性があります
1 VAR SEL = window.getSelection()変数は、現在のページがSEL領域を選択されます
選択された領域の2 VAR objRange = sel.getRangeAt(0)対象範囲が得られます
startOffset endOffsetのと同じカーソル位置を表す、選択された領域の開始位置と終了位置を表します。
anchorNodeテキストがテキストであり、ノードは、入力ボックスである、2つの値を有します。
anchorNode入力ボックスのノードは、startOffsetは、テキストボックスの位置を表す場合、全体としてのテキストの一部は、唯一の場所、位置考えルックと等価です。
3. objRange.rangeCount目標範囲選択された領域の数表す
)4. sel.removeAllRangesを(選択された範囲の対象領域を除去することができます
5. document.createRange()新しい目標範囲を作成することができます
6. sel.addRange(範囲)が選択されたターゲットエリアの範囲に加えてもよいです
基本的な考え方:
編集可能なDIVがフォーカスを失ったときに、変数に割り当てられた時間範囲のオブジェクトで記録するlastRange
編集可能なDIVの回復が集中した場合、デフォルト範囲のオブジェクトがあるでしょう、startOffsetとendOffsetのは0です
使用sel.removeAllRanges()目標範囲の選択された領域を除去することができます
使用sel.addRange(lastRange)は、選択した領域に保存されたlastRangeオブジェクトを追加することができます
誰かの家と例の詳細な説明をします。https://segmentfault.com/a/1190000005869372