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

解决方案 »

  1.   


    //获取选中的内容
    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);
      

  2.   

    <!-- function Insert(str) { 
    var obj = document.getElementById('content'); 
    if(document.selection) { 
    obj.focus(); 
    var sel=document.selection.createRange(); 
    document.selection.empty(); 
    sel.text = str; 
    } else { 
    var prefix, main, suffix; 
    prefix = obj.value.substring(0, obj.selectionStart); 
    main = obj.value.substring(obj.selectionStart, obj.selectionEnd); 
    suffix = obj.value.substring(obj.selectionEnd); 
    obj.value = prefix + str + suffix; 

    obj.focus(); 

    --> 
    找到一个更简单的