javascript – 如何查看用户选择是否在HTML范围内

发布时间：2020-12-14 22:37:27 所属栏目：资源来源：网络整理

导读：我正在开发一个Firefox插件,可以通过用户选择转换使用突出显示的屏幕温度.转换后,用户选择将替换为包含已转换ID的span HTML元素,其中包含原始温度和转换后的温度.代码中一个明显的故障是用户可以通过并选择转换后的温度并无限转换它. 我想要的是我的Javascri

我正在开发一个Firefox插件,可以通过用户选择转换使用突出显示的屏幕温度.转换后,用户选择将替换为包含已转换ID的span HTML元素,其中包含原始温度和转换后的温度.代码中一个明显的故障是用户可以通过并选择转换后的温度并无限转换它.

我想要的是我的Javascript代码检测何时用户选择包含在span元素中,重叠span元素或包含整个span元素.当用户选择全部或部分跨度时,如何检测Javascript？

我在StackOverflow上看到了类似的问题,但它想知道用户选择何时完全包含在某个元素中.这不完全是我想要的,但我不确定我需要在代码中改变什么以使其适合我的需要.

查看该小组的JS小提琴：http://jsfiddle.net/eT8NQ/

最佳答案

查看MDN的Select文档,似乎已经直接支持此功能.见Selection.containsNode().

我已经updated your fiddle了,现在它正确地返回一个布尔值,无论元素的任何部分是否在您的选择中.

function elementContainsSelection(el) {
  if (window.getSelection) {
    var sel = window.getSelection();
    if (sel.rangeCount > 0) {
      return sel.containsNode(el,true);
    }
  }
  return false;
}

除非设置了aPartlyContained标志,否则此函数默认返回false.然后部分遏制也将返回true.

aPartlyContained

When true,containsNode() returns true when a part of
the node is part of the selection.

When false,containsNode() only
returns true when the entire node is part of the selection.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!