修改、插入textarea值

最新推荐文章于 2024-01-16 14:57:09 发布

kingmxj

最新推荐文章于 2024-01-16 14:57:09 发布

阅读量270

点赞数

分类专栏： JavaScript 文章标签： OS IE Firefox

本文链接：https://blog.youkuaiyun.com/kingmxj/article/details/83890877

版权

JavaScript 专栏收录该内容

18 篇文章

订阅专栏

本文介绍了一种在textarea中实现文本替换与插入的方法。通过JavaScript实现获取选定文本的位置及长度，并提供了替换与插入功能的具体实现细节。适用于需要在前端进行文本编辑功能开发的场景。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

/**
 * 替换textarea中的选中的文字
 * @param {Object} replaceStr
 * @return {TypeName} 
 */
var replaceText = function(replaceStr) {

	var textarea = top.document.getElementById('content');
	var rangeData = getCursorPosition(textarea);

	if (rangeData == null) {
		return;
	}
	var i = rangeData.start;
	var all = textarea.value;
	var temp1 = all.substring(0, i);
	var temp2 = all.substring(i);
	var temp3 = replaceStr + temp2.substring(rangeData.text.length);
	textarea.value = temp1 + temp3;
}

/**
 * 获取textarea中的选中的文字
 * @param {Object} textarea
 * @return {TypeName} 
 */
var getCursorPosition = function(textarea) {
	var rangeData = {
		text : "",
		start : 0,
		end : 0
	};
	textarea.focus();
	if (textarea.setSelectionRange) { // W3C
		rangeData.start = textarea.selectionStart;
		rangeData.end = textarea.selectionEnd;
		rangeData.text = (rangeData.start != rangeData.end) ? textarea.value
				.substring(rangeData.start, rangeData.end) : "";
	} else if (top.document.selection) { // IE
		var i, oS = top.document.selection.createRange(),
		// Don't: oR = textarea.createTextRange()
		oR = top.document.body.createTextRange();
		oR.moveToElementText(textarea);

		rangeData.text = oS.text;
		rangeData.bookmark = oS.getBookmark();

		// object.moveStart(sUnit [, iCount])
		// Return Value: Integer that returns the number of units moved.
		for (i = 0; oR.compareEndPoints('StartToStart', oS) < 0
				&& oS.moveStart("character", -1) !== 0; i++) {
			// Why? You can alert(textarea.value.length)
			if (textarea.value.charAt(i) == '\n') {
				i++;
			}
		}
		rangeData.start = i;
		rangeData.end = rangeData.text.length + rangeData.start;
	}

	if (rangeData.text == ""
			|| (rangeData.text.length + 2) == textarea.value.length) {
		return null;
	} else {
		return rangeData;
	}
}

var ContentCurrentPostion=null; //记录当前位置,如果是IE记录的应该是一个rang范围,firefox则记录的是一个位置值

/**
 * 记录插入位置
 * @param {Object} obj
 */
var GetTextAreaPostion = function(obj){     
    if(document.selection){
        obj.focus();
        ContentCurrentPostion=document.selection.createRange(); 
    }
    else if(obj.selectionStart||obj.selectionStart=='0'){
        var startPos=obj.selectionStart;
        var endPos=obj.selectionEnd;
        ContentCurrentPostion=new Object();
        ContentCurrentPostion.startPos=startPos;
        ContentCurrentPostion.endPos=endPos;
    }
    else{
        ContentCurrentPostion=null;
    }    
}

/**
 * 插入值
 * @param {Object} value
 * @param {Object} id
 */
var SetContent = function(value)
{
	var str=value;
	var textarea = top.document.getElementById('content');
	GetTextAreaPostion(textarea);
	if(ContentCurrentPostion!=null) {
		textarea.focus(); 
        if(document.selection) {           
            ContentCurrentPostion.text=str;         
        }else{
            var startPos=ContentCurrentPostion.startPos;
            var endPos=ContentCurrentPostion.endPos;                      
            textarea.value = textarea.value.substring(0,startPos) + str + textarea.value.substring(endPos,textarea.value.length);

        }
	} else {
		textarea.value+=str;
    }    
};