javascript - Microsoft Edge 浏览器中的 range.endOffset 给出了错误的值-6ren

javascript - Microsoft Edge 浏览器中的 range.endOffset 给出了错误的值

转载作者：行者123 更新时间：2023-11-30 19:41:09

25

4

这是 Microsoft Edge 浏览器的特定问题。我正在尝试使用 Range API 将 CSS 样式附加到选定的单词。当我尝试公开功能 range.endOffset 时，边缘浏览器出现问题。在这里我附上我的代码。

  <!DOCTYPE html>
  <html>
  <body>
  <p>This is sample content</p>
  <p id="demo"></p>

  <script>
  var range = null;
  var selection = window.getSelection();
  if( selection && selection.rangeCount > 0 ) 
  {
       range = selection.getRangeAt( 0 );
  }

  var startOffset = range.startOffset;
  var endOffset = range.endOffset;

 document.getElementById("demo").innerHTML =
 startOffset + "<br>" + endOffset; 
 </script>

 </body>
 </html>

现在，如果我尝试从“P”标签中选择文本“content”，它会为 range.startOffset 提供正确的值，但为 range.endOffset 值提供不正确的值。这将导致整个“P”标签的样式困惑。此问题仅发生在 Microsoft Edge 浏览器中，并且如果所选文本以某个 html 标记结尾(如此处)，则它以“内容”文本结尾。如果我尝试选择文本之间的文本，则不会出现此问题。它在 chrome 浏览器中工作。在边缘浏览器中是否有解决此问题的解决方法？

最佳答案

你的 Edge 浏览器是什么版本？我在 Edge 42 和 Edge 44 版本上使用以下代码重现了您的问题。

<p>This is sample content</p>
<p id="demo"></p>

<script>
    document.getElementsByTagName('p')[0].onmouseup = function () {
        var range = null;
        var selection = window.getSelection();
        if (selection && selection.rangeCount > 0) {
            range = selection.getRangeAt(0);
        }

        var startOffset = range.startOffset;
        var endOffset = range.endOffset;

        document.getElementById("demo").innerHTML =
            startOffset + "<br>" + endOffset;
    }
</script>

在 Edge 42 版本上，如果我选择“content”，endOffset 将为 1。

在 Edge 44 版本上，如果我拖动以选择“内容”，则 endOffset 效果很好，但如果我使用双击方法选择“内容”，endOffset 仍然是 1。

所以，这个问题和Edge浏览器有关，我已经把这个问题反馈给Edge Platform了。

作为解决方法，我建议您可以根据 startOffset 和所选文本计算 endOffset。尝试使用以下代码:

<p>This is sample content</p>
<p id="demo"></p>

<script>
    document.getElementsByTagName('p')[0].onmouseup = function () {
        var range = null;
        var selection = window.getSelection();
        if (selection && selection.rangeCount > 0) {
            range = selection.getRangeAt(0);
        }

        var startOffset = range.startOffset;
        var endOffset = startOffset + selection.toString().length;

        document.getElementById("demo").innerHTML =
            startOffset + "<br>" + endOffset + "<br/>" + selection;
    }
</script>

截图如下:

关于javascript - Microsoft Edge 浏览器中的 range.endOffset 给出了错误的值，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/55392522/

25

4

0

文章推荐： c - 如何使用 C 在 BSD 套接字中处理 3 路 send() 和 receive()

文章推荐： c# - 以不同于 GET 的方式处理 POST

文章推荐： c# - 从 View 模型更新模型

文章推荐： c - 如何从磁盘镜像复制文件？

Excel vba : possible bug when creating a range as a sub-range of another range
我创建了以下 sub 来简单地说明问题。我将事件工作表的范围 A2:E10 分配给范围变量。然后，对于另一个范围变量，我将这个范围的子范围，单元格 (1, 1) 分配给 (3, 3)。我原以为这将包
vba - 将 Range.Text 关联到 Range.Start 和 Range.End
我使用正则表达式来搜索以下属性返回的纯文本: namespace Microsoft.Office.Interop.Word { public class Range {
excel - If Not (range) or (range) = Nothing Then
我正在开发一个宏来突出显示某些行/单元格以供进一步审查。一些值/空白将以红色突出显示，其他以橙色突出显示，而整行应为黄色。我从上一个问题中得到了一些帮助，并添加了更多细节，它工作得几乎完美，但我被困在
python - "for/range"range 大的时候会不会很耗内存？
这个问题在这里已经有了答案: What is the difference between range and xrange functions in Python 2.X? (28 个答案) 关闭
Python - 不支持的类型 : range and range
我在尝试运行脚本时遇到这个奇怪的错误，代码似乎是正确的，但似乎 python (3) 不喜欢这部分: def function(x): if int
c++ - 为什么从采用 std::ranges::output_range 的算法返回 std::ranges::safe_iterator_t 而不是 std::ranges::safe_subrange_t
我正在编写一种算法，将一些数据写入提供的输出范围(问题的初始文本包括具体细节，这将评论中的讨论转向了错误的方向)。我希望它在 API 中尽可能接近标准库中的其他范围算法。我查看了 std::rang
c++ - 在 range v3 库中，为什么 ranges::copy 不适用于 ranges::views::chunk 的输出？
这按预期工作: #include #include int main() { auto chunklist = ranges::views::ints(1, 13) | ranges::vie
string - 无法将类型 'Range' 的值转换为预期的参数类型 'Range'(又名 'Range')
我这里有一个字符串，我正在尝试对其进行子字符串化。 let desc = "Hello world. Hello World." var stringRange = 1..' 的值转换为预期的参数类型
.net - MySQL时间偏移(Range from within a Range)
我有一个高级搜索功能，可以根据日期和时间查询记录。我想返回日期时间范围内的所有记录，然后从该范围内返回我想将结果缩小到一个小时范围(例如 2012 年 5 月 1 日 - 2012 年 5 月 7 日
function - range 函数和 range 关键字有什么区别？
Go 中的 range 函数和 range 关键字有什么区别？ func main(){ s := []int{10, 20, 30, 40, 50, 60, 70, 80, 90}
scala - 将 Scala Range 拆分为大小均匀的连续子 Range
如果我有一个范围，如何将其拆分为一系列连续的子范围，其中指定了子范围(存储桶)的数量？如果没有足够的元素，则应省略空桶。例如: splitRange(1 to 6, 3) == Seq(Range(
Excel开发: How to detect that a Range overlaps another Range?
我正在开发 VSTO Excel 项目，但在管理 Range 对象时遇到一些问题。实际上，我需要知道当前选定的范围是否与我存储在列表中的另一个范围重叠。所以基本上，我有 2 个 Range 实例，我
c++ - 满足 std::ranges::range 概念
在即将推出的 C++20 系列中，将有 range concept具有以下定义: template concept range = __RangeImpl; // exposition-only de
range - VHDL 'range => ' 0' 命令
希望有人能回答我的问题。我在 VHDL 代码中遇到了这个命令，但不确定它到底做了什么。有人可以澄清以下内容吗？ if ( element1 = (element1'range => '0')) the
python - Python 中 range() 中的嵌套 range()
可以将范围嵌套在范围中吗？使用范围内的变量？因为我想取得一些效果。为了说明这个问题，我有以下伪代码: for i in range(str(2**i) for i in range(1,2)):
python : range between dates when range field has time
我想在 2 个日期之间创建一个范围，并且我的范围字段有时间 damage_list = Damage.objects.filter(entry_date__range=(fdate, tdate))
c++ - 使用基于自动的 Ranged for 循环与使用基于对的 Ranged for 循环
在下面的代码中 #include #include #include int main() { std::unordered_mapm; m["1"]=1; m["2"]=2
excel - 循环不更新 range.row 或 range.column
我试图为我的电子表格做一个简单的循环，它循环遍历一个范围并检查该行是否为空，如果不是，则循环遍历一系列列并检查它们是否为空，如果是则它设置一个消息。问题是每次它通过循环 ro.value 和 col
VBA Excel : Assigning range values to a new range
我在将一个工作簿范围中的值分配给当前工作簿中的某个范围时遇到问题。当我使用 Range("A1:C1") 分配我的范围时，此代码工作正常，但是当我使用 Range(Cells(1,1),Cells(1
vba - Range.Cells.Count 与 Range.Count
我改写了原来的问题。 Sub s() Dim r As Range Set r = ActiveSheet.Range("B2:D5") Debug.Print r.Rows.Count

首页

博学

6Ren·AI

商城

javascript - Microsoft Edge 浏览器中的 range.endOffset 给出了错误的值