js往选择焦点后添加文字

在一个textarea 中，鼠标焦点在任意文字后面，然后点击一个按钮，就往textarea中输入固定的文字
需要兼容多种浏览器
textarea中有 一段文字 "1234567890"
我把鼠标焦点设置在4后面，点击一个button按钮，在 4字后面自动添加固定文字 "你好"，
文本内容变成 "1234你好567890"

 

//获取选中的内容
function getSelectionField(e) {
    var selection = getIeSelection(e);
    if (selection == '') {
        selection = getFireFoxSelection(e);
    }
    return selection;
}

function getIeSelection(e) {
    if (window.getSelection) {
        // This technique is the most likely to be standardized.
        // getSelection() returns a Selection object, which we do not document.
        return window.getSelection().toString();
    }
    else if (document.getSelection) {
        // This is an older, simpler technique that returns a string
        return document.getSelection();
    }
    else if (document.selection) {
        // This is the IE-specific technique.
        // We do not document the IE selection property or TextRange objects.
        return document.selection.createRange().text;
    }
}

function getFireFoxSelection(e) {
    if (e.selectionStart != undefined && e.selectionEnd != undefined) {
        var start = e.selectionStart;
        var end = e.selectionEnd;
        return e.value.substring(start, end);
    } else {
        return "";
    } // Not supported on this browser
}

//在e元素的当前光标位置插入文本
//var cursPos;
function insertText(e, str) {
    var cursPos = TraceCursorPosition(e); // 获取光标位置
    e.value = e.value.slice(0, cursPos.start) + str + e.value.slice(cursPos.end)
}

// 跟踪光标位置
function TraceCursorPosition(obj) {
    var cursPos = $CursorPosition(obj);
    return cursPos;
}

// 返回光标所在位置
/**//*
* source:
* source:
* acknowledges for Marshall
* example:
* var myTextBox = document.getElementById(“MyTextBoxID”);
* var cursPos = $CursorPosition(myTextBox);
* alert(cursPos.item[0] + ” ” + cursPos.item[1]);
* // OR
* alert(cursPos.start + ” ” + cursPos.end);
*/
function $CursorPosition(textBox) {
    var start = 0, end = 0;
    //如果是Firefox(1.5)的话，方法很简单
    if (typeof (textBox.selectionStart) == "number") {
        start = textBox.selectionStart;
        end = textBox.selectionEnd;
    }
    //下面是IE(6.0)的方法，麻烦得很，还要计算上’\n’
    else if (document.selection) {
        var range = document.selection.createRange();
        if (range.parentElement().id == textBox.id) {
            // create a selection of the whole textarea
            var range_all = document.body.createTextRange();
            range_all.moveToElementText(textBox);
            //两个range，一个是已经选择的text(range)，一个是整个textarea(range_all)
            //range_all.compareEndPoints()比较两个端点，如果range_all比range更往左(further to the left)，则
            //返回小于0的值，则range_all往右移一点，直到两个range的start相同。
            // calculate selection start point by moving beginning of range_all to beginning of range
            for (start = 0; range_all.compareEndPoints("StartToStart", range) < 0; start++)
                range_all.moveStart('character', 1);
            // get number of line breaks from textarea start to selection start and add them to start
            // 计算一下\n
            for (var i = 0; i <= start; i++) {
                if (textBox.value.charAt(i) == '\n')
                    start++;
            }
            // create a selection of the whole textarea
            var range_all = document.body.createTextRange();
            range_all.moveToElementText(textBox);
            // calculate selection end point by moving beginning of range_all to end of range
            for (end = 0; range_all.compareEndPoints('StartToEnd', range) < 0; end++) {
                range_all.moveStart('character', 1);
            }
            // get number of line breaks from textarea start to selection end and add them to end
            for (var i = 0; i <= end; i++) {
                if (textBox.value.charAt(i) == '\n')
                    end++;
            }
        }
    }
    //return [start, end]; // 包括选中区域的起始位置
    // modified to return as Object
    return { 'start': start, 'end': end, 'item': [start, end] };
}

///e=document.getElementById('textboxid'); s=插入的值.
insertText(e, s);