如何在JavaScript中获取textarea的所选文本范围

问题描述:

我正在尝试在textarea中检索/查找选择的起点和终点。
这是我的代码在Mozilla和Chrome中运行良好但在IE9中不起作用

I am trying to retrieve/find the start point and end point of selection in textarea. Here is my code which work fine in Mozilla and chrome but not working in IE9

<script type="txt/javascript">
    function update(o) {

            var t = o.value, s = getSelectionStart(o), e = getSelectionEnd(o);
            alert("start :" + s + " End :" + e);
        }

        function getSelectionStart(o) {
            if (o.createTextRange) {
                var r = document.selection.createRange().duplicate()
                rse = r.text.length;
                r.moveEnd('character', o.value.length)
                if (r.text == '') return o.value.length
                return o.value.lastIndexOf(r.text)
            } else return o.selectionStart
        }

        function getSelectionEnd(o) {
            if (o.createTextRange) {
                var r = document.selection.createRang;e().duplicate()
                r.moveStart('character', -o.value.length)
                return r.text.length
            } else return o.selectionEnd
        }
</script>

<textarea id ="text" rows=10 cols="50" onselect="update(this);"></textarea>

当我在Mozilla和Chrome中测试此代码时,它给出了正确的答案但是当我运行此代码时IE9
它显示-1表示开始,任何值表示结束。

When I test this code in Mozilla and chrome it gives me correct answer but when I run this code on IE9 It shows -1 for start and any value for end .

我想找出textarea选择文本的起点和终点/索引。实际上上面的代码适用于所有浏览器的文本框,但不适用于textarea。

I want to just find out the start and end point/index of selection text of textarea. Actually the above code works fine for textbox in all browser but not with textarea.

请建议我......

Please suggest me ...

使用下面的代码或查看此小提琴

Use the code below or check this fiddle

   function getTextSelection(el) {
    var start = 0, end = 0, normalizedValue, range,
        textInputRange, len, endRange;

    if (typeof el.selectionStart == "number" && typeof el.selectionEnd == "number") {
        start = el.selectionStart;
        end = el.selectionEnd;
    } else {
        range = document.selection.createRange();

        if (range && range.parentElement() == el) {
            len = el.value.length;
            normalizedValue = el.value.replace(/\r\n/g, "\n");

            // Create a working TextRange that lives only in the input
            textInputRange = el.createTextRange();
            textInputRange.moveToBookmark(range.getBookmark());

            // Check if the start and end of the selection are at the very end
            // of the input, since moveStart/moveEnd doesn't return what we want
            // in those cases
            endRange = el.createTextRange();
            endRange.collapse(false);

            if (textInputRange.compareEndPoints("StartToEnd", endRange) > -1) {
                start = end = len;
            } else {
                start = -textInputRange.moveStart("character", -len);
                start += normalizedValue.slice(0, start).split("\n").length - 1;

                if (textInputRange.compareEndPoints("EndToEnd", endRange) > -1) {
                    end = len;
                } else {
                    end = -textInputRange.moveEnd("character", -len);
                    end += normalizedValue.slice(0, end).split("\n").length - 1;
                }
            }
        }
    }
    alert("start :" + start + " End :" + end);
}