在 textarea中指定位置插入内容

完全使用 javascript 来实现，这里我也是从其它博客转载来一部分实现的，可以完美解决IE7+不兼容问题，并且包含谷歌、火狐，更不用说什么360/360急速、搜狗浏览器了

 

function insertAtCursor(myField, myValue) { 
    //IE support
    if (document.selection) { 
        document.selection.empty();
        caretPos.text = myValue;
        caretPos.select();
        myField.focus(); 
    } 
    //MOZILLA/NETSCAPE support 
    else if (myField.selectionStart || myField.selectionStart == '0') { 
        var startPos = myField.selectionStart; 
        var endPos = myField.selectionEnd; 
        // save scrollTop before insert 
        var restoreTop = myField.scrollTop; 
        myField.value = myField.value.substring(0, startPos) + myValue + myField.value.substring(endPos, myField.value.length); 
        if (restoreTop > 0) { 
        myField.scrollTop = restoreTop; 
        } 
        myField.focus(); 
        myField.selectionStart = startPos + myValue.length; 
        myField.selectionEnd = startPos + myValue.length; 
    } else { 
        myField.value += myValue; 
        myField.focus(); 
    } 
} 

 

myField 参数为 js document 对象，比如：document.getElementById("")，myValue 为要插入的值

 

caretPos 对象为什么要定义成全局变量？

 

往往场景在文本域中，鼠标已经放入焦点了，但是要插入内容，所以去选择内容时，焦点失去了，所以把变量定义成全局的，就是在文本域中获得焦点时，就把位置保存起来，这个只适用于IE情况。

 

 

var caretPos ;
function setPos(){
	if (document.selection) { //IE
		caretPos =  document.selection.createRange(); 
	}
}

 

html代码

 

<textarea rows="4" onchange="setPos()" onfocus="setPos()" ></textarea>

 

一定要加上onchange="setPos()"  ，因为每次手动在文本域里面添加内容时，在插入数据，IE记住的点事在输入的内容之前，所以会把自己手动输入的内容给覆盖掉

 

当做笔记记下来，以后肯定用得着