javascript - 从js中的窗口选择中删除空格

Question

我正在尝试从用户选择的文本中删除前导或尾随(有时两者)空格。按照这个answer执行。这适用于简单的情况，但是，当选定的文本包含标签或   时，它会失败。

示例:在 fiddle 中尝试从右到左突出显示 -- hi this is bob.，包括末尾的空格，然后按“trim ”。

这会导致:

Uncaught IndexSizeError: Failed to execute 'setEnd' on 'Range': The offset 24 is larger than or equal to the node's length (5).

我想这可以被捕获

 if (method == range.setEnd  && range.startOffset + ind >= range.endContainer.length)

但我不知道如何处理它。我还尝试使用替换硬空间

e2 = document.getElementById('e2');
e2.innerHTML = e2.innerHTML.replace(/ /gi, ' ');

但是，这会使选择为空。代码:

function removeWsFromSelection(fromStart) {
  selection = window.getSelection();
  range = selection.getRangeAt(0);
  if (fromStart) {
    regex = /[^\s]/;
    container = range.startContainer;
    method = range.setStart;
  } else {
    regex = /\s+$/;
    container = range.endContainer;
    method = range.setEnd;
  }

  match = regex.exec(selection.toString());
  if (match) {
    ind = match.index;
    if (ind > 0) {
      // ind is the first non-ws char from the start or first ws char from the end,
      // hence (startOffset + ind)
      method.call(range, container, range.startOffset + ind);
      rng = range.cloneRange();
      selection.removeAllRanges();
      selection.addRange(rng);
    }
  }
}

顺便说一句，不幸的是，Selection.modify 对我不起作用，而且它被认为 non-standard .

Answer 1

如果您擅长范围修改，则可以检查 trim 符号从开始和结束的长度，然后修改范围的 startOffset 和 endOffset。但可以肯定的是，对于 startContainer 和 endContainer 不是同一节点的情况，这不是 Elixir 。至少它在某些情况下有效。

const sel = window.getSelection();
const text = sel.toString();
const range = sel.getRangeAt(0);

const startOffset = text.length - text.trimStart().length;
const endOffset = text.length - text.trimEnd().length;

if (startOffset) {
  range.setStart(range.startContainer, range.startOffset + startOffset);
}

if (endOffset) {
  range.setEnd(range.endContainer, range.endOffset - endOffset);
}