Javascript 如何确定contenteditable DIV中的选择是从左到右还是从右到左

在contenteditable DIV中，我想确定用户是从左到右还是从右到左进行选择。有人为浏览器Firefox、Chrome、Safari和Opera提供Javascript解决方案吗？如果可能的话，也为IE提供一个

<div id="editor" contenteditable>
Selection from Cursor end | here <strong>over bold</strong> to Cursor start | here.
</div>

从光标结束|此处到粗体再到光标开始|此处进行选择。

我在JSFIDLE中准备了以下代码：

---

提前感谢：-）

这是一个函数，它使用这样一个事实：将DOM范围的结尾设置为文档中早于范围开始的点，将折叠该范围

演示：

代码：

它适用于除IE<9之外的所有主要浏览器，IE<9不支持与其他浏览器相同的范围和选择API

对于IE<9，选择API中没有任何内容可以告诉您选择方向。我所能建议的最好方法是使用事件跟踪先前选择的范围，并查看每次触发时哪个端点发生了变化。在下面的示例中，它似乎有效，但除此之外没有进行任何测试，因此使用风险自负

演示：

附加代码：

var selectedRange, selectionBackwards;

document.onselectionchange = function(evt) {
    evt = evt || window.event;
    var sel = document.selection;
    if (sel && sel.type !== "Control") {
        if (sel.type == "Text") {
            // Selection is not collapsed, so compare range end points
            var newRange = sel.createRange();
            if (selectedRange) {
                var startChanged = (newRange.compareEndPoints("StartToStart", selectedRange) != 0);
                var endChanged = (newRange.compareEndPoints("EndToEnd", selectedRange) != 0);

                if (startChanged && !endChanged) {
                    selectionBackwards = true;
                } else if (endChanged && !startChanged) {
                    selectionBackwards = false;
                } else if (startChanged && endChanged) {
                    // Both ends have changed, which is confusing.
                    // I suspect this can happen when the selection snaps
                    // to words. In this case we can tell nothing, so leave
                    // selectionBackwards alone.
                } else {
                    // Neither end has changed, so we can tell nothing.
                }
            }

            selectedRange = newRange;
        } else {
            // Selection is collapsed
            selectionBackwards = false;
        }
    }
};

range.setStart（锚定节点、锚定偏移）；
range.setEnd（focusNode，focusOffset）；
如果（range.collapsed==false）{
colsole.log（“向前选择”）；
}否则{
colsole.log（“向后选择”）；
}

谢谢，这正是我想要的：-）是否有人也为Internet Explorer版本6、7和8提供了解决方案？@Max:除非有一些非常模糊的东西我在查找后从未发现，否则在6-8中是不可能的。JavaScript API中没有任何东西可以用来获取选择方向。@Max:您可以通过观察事件来做一些事情（例如，跟踪以前选择的范围并查看哪一端发生了变化）@Max:我想出了一些似乎在我尝试过的非常有限的测试用例中有效的方法。查看我的更新答案。检查

范围。折叠的

看起来比

比较文档位置

简单。

var selectedRange, selectionBackwards;

document.onselectionchange = function(evt) {
    evt = evt || window.event;
    var sel = document.selection;
    if (sel && sel.type !== "Control") {
        if (sel.type == "Text") {
            // Selection is not collapsed, so compare range end points
            var newRange = sel.createRange();
            if (selectedRange) {
                var startChanged = (newRange.compareEndPoints("StartToStart", selectedRange) != 0);
                var endChanged = (newRange.compareEndPoints("EndToEnd", selectedRange) != 0);

                if (startChanged && !endChanged) {
                    selectionBackwards = true;
                } else if (endChanged && !startChanged) {
                    selectionBackwards = false;
                } else if (startChanged && endChanged) {
                    // Both ends have changed, which is confusing.
                    // I suspect this can happen when the selection snaps
                    // to words. In this case we can tell nothing, so leave
                    // selectionBackwards alone.
                } else {
                    // Neither end has changed, so we can tell nothing.
                }
            }

            selectedRange = newRange;
        } else {
            // Selection is collapsed
            selectionBackwards = false;
        }
    }
};