Javascript 检测用户选择之外的鼠标右键单击（高亮显示）

假设用户在页面上选择了文本/图像/任何内容，然后单击鼠标右键。有什么方法可以检测他是在选择范围外还是在选择范围内单击？

嗯，我不知道直接的答案，但你可以试试这个：

1-在第一次单击中，获取x1=clientX和y1=clientY

2-在mouseup上获取x2=clientX和y2=ClientY

3-右键单击，检查clientX和clientY是否介于1-和2-矩形中的角x1、y1、x2、y2之间

代码：

var x1,x2,y1,y2;
var selected = false;
document.onmousedown = function(e){
...
}
document.onmouseup = function(e){
    x2 = e.clientX;
    y2 = e.clientY;
    selected = true;
}

---

经过多次尝试，我认为没有干净的解决办法

我终于想出了一个‘s’的调整，它本身就是在同一个线程上的‘s’的调整，以满足您的需要

这意味着在右键单击easy部分时获取当前选择的范围，然后检查事件的目标节点是否在此范围内。遗憾的是，没有简单的方法获取Range对象中包含的节点，因此我们必须遍历Range.startContainer和Range.endContainer之间包含的节点

*即使是一个包含range.extractioncontents和mutationobserver的

注:

因为当我们右键单击时，Chrome似乎为我们选择了一个新的范围，所以如果你右键单击文本，它将始终返回true。 当您选择一个img标记时，实际上您选择的是元素前后的textNodes，因此如果您选择下面示例中的第一个图像，并右键单击某个虚拟文本，它将返回true。但是如果对第二个图像执行相同的测试，则不会，因为文本被包装到元素中。 根据浏览器、操作系统等的不同，可能还有很多其他的注意事项。 函数IsInsidenceOnEvent{ 违约事件； var p=document.querySelector'result'； p、 innerHTML= var sel=window.getSelection； 如果！sel.rangeCount返回； var范围=sel.getRangeAt0； //未选择任何内容：不做任何事情 ifrange.report； //Firefox允许我们获得我们点击的真实节点 var result=ISTargetInRange，event.explicitOriginalTarget，event.target； p、 innerHTML='在目标中单击：'+结果； } 函数getNextNode{ if node.firstChild 返回node.firstChild； while节点{ 如果node.nextSibling返回node.nextSibling； node=node.parentNode； } } 函数ISTargetInRange、nodeTarget、elementTarget{ var start=range.startContainer.childNodes[range.startOffset]| | range.startContainer； var end=range.endContainer.childNodes[range.endOffset]| | range.endContainer； var common祖先=range.commonAncestorContainer； var节点=[]； var节点； var结果=假； 对于node=start.parentNode；node；node=node.parentNode { //我们的目标是一个元素 如果！nodeTarget&&elementTarget==节点{ 结果=真； 打破 } nodes.pushnode； 如果节点==公共祖先 打破 } 节点：反向； //从起点走到终点 对于节点=开始；节点；节点=GetNextNode { //我们的目标可以是textNode ifnodeTarget&&nodeTarget==node | |！nodeTarget&&elementTarget==node{ 结果=真； 打破 } 如果节点==结束 打破 } 返回结果； }; document.addEventListener'contextmenu'，IsInsidenceSelection，false； 结果{位置：固定；底部：0；右侧：0}

一些虚拟文本 其他一些文本

---

通过一些文本检查，这可能会对您有所帮助抱歉，这不是我想要实现的。对于这种非常具体的情况，我认为您没有很多解决方案，您可以得到的最接近的解决方案是：1检测用户何时选择了简单的内容。2检索该元素的父节点。3用包含占位符类的较新元素替换所选元素。4在该类上添加右键单击事件侦听器，在dom的其余部分添加右键单击事件侦听器。一些可能对你有帮助的参考：，@briosheje，那么如果你选择的是一个单独的文本节点直接放在正文中，你会复制完整的文档吗？此外，如何处理部分/多个选定元素？您提供的第一个链接只能获取所选内容的文本内容，没有其他元素。@Danny，您找到解决方案了吗？我在回答中列举的要点总是正确的，主要是不同浏览器的行为。也许你应该给我们一个更准确的背景，你需要什么。我想这是我能得到的最接近的解决方案。有任何片段可以轻松实现这一点吗？我想的另一个方法是获取包含选择的元素列表，然后在右键单击事件中循环它们。非常感谢。不过我有点困惑。当用户单击外部选择时，如何正确管理案例？简单else或反转>和