使用来自父元素的javascript计算用户选择的开始和结束位置

时间:2012-01-22 03:20:29

标签: javascript html

我正在寻找一种方法来计算来自已知父元素的用户选择的开始和结束位置。我偶然发现this稍微修改了一下我能够为FF工作,但是我不知道如何在IE中这样做,如果我的修改是合适的,我很想得到一些想法。非常感谢Tim Down的原始答案。

function getBodyTextOffset(node, offset) {
    var sel = window.getSelection();
    var range = document.createRange();
    range.selectNodeContents(document.getElementById('test'));
    range.setEnd(node, offset);
    sel.removeAllRanges();
    sel.addRange(range);
    return sel.toString().length;
}

function getSelectionOffsets() {
    var sel, range;
    var start = 0, end = 0;
    if (window.getSelection) {
        sel = window.getSelection();
        if (sel.rangeCount) {
            range = sel.getRangeAt(sel.rangeCount - 1);
            start = getBodyTextOffset(range.startContainer, range.startOffset);
            end = getBodyTextOffset(range.endContainer, range.endOffset);
            sel.removeAllRanges();
            sel.addRange(range);
            alert(start + ", " + end);
        }
    } else if (document.selection) {
        // IE stuff here
    }
    return {
        start: start,
        end: end
    };
}

我知道这已经有一段时间了,但这里有一个显示这个想法的JSFiddle。它再次适用于FF和Chrome,但不适用于IE9。理想情况下,我希望能够从元素测试的开始获得偏移量。

1 个答案:

答案 0 :(得分:1)

JavaScript范围是一个痛苦的话题,虽然这里有一些很好的资源......

以下是一些可以用作参考的演示......

http://dylanschiemann.com/articles/dom2Range/dom2RangeExamples.html

一个含糊不清的起点,了解可用的方法和属性...... http://help.dottoro.com/ljxsqnoi.php

您可以使用以下JavaScript发现包含内容的内容......

for (i in window.getSelection()) {alert('i = '+i);}

当你看到提到的对象你可以附加它时,只要确保你知道也使用括号方法和罕见的场合参数,如下面的那个......

for (i in window.getSelection().getRangeAt(0)) {alert('i = '+i);}

在Gecko浏览器(例如Firefox)中还有一个非常讨厌的范围错误,如果你将鼠标稍微移动到一个元素之外虽然少于50%的字母/字符,Gecko错误地将边界元素设置为该元素即使它没有被选中。只是试图找出它是什么并且Mozilla实际上拒绝修复它是非常讨厌的(因为它们有许多其他错误,它们显然是错误的),这里是我发布的错误帖子的链接... < / p>

https://bugzilla.mozilla.org/show_bug.cgi?id=696571

希望这会让你朝着正确的方向前进。