Question

我正在使用window.getSelection().getRangeAt(0)来选择要操作的文本。但是，当我选择<b>标记时，返回的范围是1。

无论标签是什么，我怎样才能获得适当的范围？\

完整性代码：

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
  <div id="text">
    <b>smfk</b> - osdnmfoaidsmnfoids
  </div>
</body>
</html>

$("#text").mouseup(function (evt) {
  var selectionRange = window.getSelection().getRangeAt(0);
  var range = selectionRange.endOffset - selectionRange.startOffset;

    alert(range);

});

突出显示smfk，smfk -等返回1,2,3 ......作为范围

编辑：我需要返回排除任何标签的范围......所以如果我选择smfk -，它应该返回 0-4 ，而不是 0-11

Answer 1

$("#text").mouseup(function (evt) {
  var selectionRange = window.getSelection().getRangeAt(0);
  var start = selectionRange.startOffset;
  var end = selectionRange.endOffset;  
  var length = window.getSelection().toString().length;

  if (start === end || end < start || (end - start) !== length){
    end = start + length;
  }

  var range = end - start;

    alert(range);

});

只需在计算中添加一些验证 演示： http://jsbin.com/caxuk/2/edit

Answer 2

endOffset是指endContainer（unbolded text），startOffset是指startContaner（粗体文本）。

此案例的简易解决方案：如果start容器不等于end容器，则启动容器长度 - startOffset + endOffset，试一试。

查看Range spec，特别是[2.7]。提取内容]部分。

Javascript`getSelection（）。getRangeAt（0）`与标签无法正常工作

2 个答案: