使用javascript检测用户选择的方向

我正在用自定义插入符号模拟项目中的文本编辑器，但使用本机选择。有没有办法检测用户选择文本的方向？假设，该用户选择了文本“hello world”。有两种可能，他可以先在字母“d”上单击鼠标，然后在字母“h”上结束，或者他可以从字母“h”开始，然后在字母“d”上结束。有什么简单的方法可以区分这两种情况吗？谢谢。

据我所知，Javascript没有本机属性或事件可以告诉您方向。详细介绍如何跟踪鼠标方向，您可以根据需要进行调整

基本上，只要您可以检索鼠标位置（使用

loc.pageX

或Y，或

event.clientX

或Y），您就可以编写自己的函数来根据位置和时间跟踪方向

---

在您的情况下，您可能只希望在用户“选中”文本时捕获此信息，即在

mousedown

事件上。

跟踪mousedown X offet，然后跟踪mouseup X偏移，结果显示方向：（使用jQuery）

var textSelectionDirection=（函数（）{
变量方向=“”，鼠标向下偏移量=null；
功能方向（e）{
如果（e.type=='mousedown'）
mousedowncoffset=e.clientX；
else if（e.type=='mouseup'）{
方向=e.clientX

演示：

这应该可以：

function isBackwards(sel) {
  var rg = document.createRange();
  rg.setStart(sel.anchorNode, sel.anchorOffset);
  rg.setEnd(sel.focusNode, sel.focusOffset);
  return !rg.toString();
}

---

注意：如果您只允许选择分隔符和空格，则需要修改上述函数，因为在这种情况下，无论发生什么情况，它都将返回

true

。

旧问题，但我想我应该添加一个更简单的解决方案：

var sel = getSelection(),
position = sel.anchorNode.compareDocumentPosition(sel.focusNode),
backward = false;
// position == 0 if nodes are the same
if (!position && sel.anchorOffset > sel.focusOffset || 
  position === Node.DOCUMENT_POSITION_PRECEDING)
  backward = true; 

---

Node.compareDocumentPosition（）

我试图找到一个适合我几天的解决方案。以下是我的想法，这将适用于单范围选择：

var selection = window.getSelection();
var range = selection.getRangeAt(0);
var isSelectionDown = selection.focusNode === range.endContainer;
var isSelectionUp = selection.focusNode === range.startContainer;

---

选择的焦点节点总是在用户释放鼠标的位置，但范围结束和开始容器会根据方向而变化。

我认为选择对象不够智能，无法实现这一点。你必须记录鼠标点击的位置，然后自己计算出来。@Diodeus回答这个问题，这样他就可以接受了。和（在）OP尝试为这些操作添加自定义setter和getter，方法是使用默认值并在其中添加鼠标位置计算。这是可能的。谢谢你，我担心，我将不得不这样做：）@TimDown肯定这是可能的，我提供的链接有一种方法。只是没有一个本机函数/属性（例如window.mouseDirection）提供给您；您需要手工编写自定义代码，如您的示例中所示。这目前仅适用于鼠标选择，而不适用于键盘。在单个文本节点中不适用。仅当开始节点和结束节点不相同时有效。仅当选择跨越多个节点时有效。如果不是问题，则可以简化为：

var isReverse=selection.anchorNode！==选择.getRangeAt（0）.startContainer
var selection = window.getSelection();
var range = selection.getRangeAt(0);
var isSelectionDown = selection.focusNode === range.endContainer;
var isSelectionUp = selection.focusNode === range.startContainer;