javascript - 当我关注页面中的另一个元素时，如何将选择保留在 div 中？

Question

我正在使用文本编辑器，我从 @TimDown 的 rangy库中受益匪浅，但是当我选择一些文本并专注于文本输入以在其上写入链接时，此链接将应用于稍后的选择，我失去了选择，选择变为未选中！

Answer 1

您可以将选择保存在变量中，如下所示：

  var sel = window.getSelection().getRangeAt(0);   //get cursor position
  sel = [[sel.startContainer,sel.startOffset],  
         [sel.endContainer,sel.endOffset]
  ];   //save cursor position (start and end);
  /*Do whatever, let the user change selected element*/

现在，当您在变量中进行选择时，您可以做任何您想做的事情。但是不能改变参与选择的节点，否则选择会指向无效范围。
现在您可以再次选择文本：

  var range = document.createRange();  //Creade range object. This is not IE compatible!
  range.setStart(sel[0][0], sel[0][1]);  //Load start from our variable
  range.setEnd(sel[1][0], sel[1][1]);    //Load end too
  var s = window.getSelection();
  s.removeAllRanges();  //I'm not sure this is necessary
  s.addRange(range);

然后你可以得到文本：

  alert("Selected: "+s.toString());