如何確定使用者選擇在其父 HTML 元素內的開始和結束字元偏移量？

確定其父容器內範圍的開始和結束偏移量

問題

給定一個HTML 元素，如何確定字元偏移量在範圍（使用者選擇）開始和結束的父容器內，即使選擇跨越HTML

解決方案

更新的回應：

要取得開始與結束偏移：

function getSelectionCharacterOffsetWithin(element) {
  // Determine start and end offsets
  var start = 0;
  var end = 0;
  // Create ranges
  var range = getRangeAt(0);
  var preCaretRange = range.cloneRange();

  // Set start offset
  preCaretRange.selectNodeContents(element);
  preCaretRange.setEnd(range.startContainer, range.startOffset);
  start = preCaretRange.toString().length;

  // Set end offset
  preCaretRange.setEnd(range.endContainer, range.endOffset);
  end = preCaretRange.toString().length;

  // Return the object
  return { start: start, end: end };
}

原始回覆：

提供的程式碼利用getSelection() 和getRangeAt(0) 來擷取選擇。然後，它使用範圍上的 toString() 方法計算元素內插入符號位置的偏移。此方法僅提供結束偏移或插入符位置。

範例：

function getRangeCharacterOffsetWithin(element) {
  var range, sel;
  if ((sel = window.getSelection())) {
    range = sel.getRangeAt(0);
    range.collapse(false);
    prevRange = range.cloneRange();
    prevRange.selectNodeContents(element);
    prevRange.setEnd(range.endContainer, range.endOffset);
    return prevRange.toString().length;
  }
  return 0;
}

以上是如何確定使用者選擇在其父 HTML 元素內的開始和結束字元偏移量？的詳細內容。更多資訊請關注PHP中文網其他相關文章！