把选择定内容增加到文本框

提示：您可以先修改部分代码再运行

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.zzzyk.com/1999/xhtml" lang="zh-CN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Language" content="zh-CN" />
<title></title>

function $( id ) {
	var obj = null;
	obj = document.getElementById(id);
	return obj ? obj : null;
}

function show( id ) {
	$(id).style.display = "block";
}

function hide( id ){
	$(id).style.display = "none";
}

function MouseEvent(e) {
    this.e = e || window.event;
    this.x = e.pageX || e.clientX;
    this.y = e.pageY || e.clientY;
    this.target = e.target || e.srcElement;
}

function addListener(type, callback) {
    if (document.addEventListener) {
        document.addEventListener(type, callback, false);
    } else if (document.attachEvent) {
        document.attachEvent("on"+type, callback, false);
    }
}

function removeListener (type, callback) {
    if (document.removeEventListener) {
        document.removeEventListener(type, callback, false);
    } else if (document.detachEvent) {
        document.detachEvent("on" + type, callback, false);
    }
}

function handleDown() {
	
	if($('selected')) {
		$('selected').outerHTML = $('selected').innerHTML;
		hide('editbox');
	}
    addListener("mouseup", handleUp);
}

function handleUp(e) {

r.execCommand('ForeColor', false, 'red');
		
		var regExp = /<font(.*)</font>/i;
		e.target.innerHTML = e.target.innerHTML.replace(regExp, '<span id="selected" style="color: red">'+str+'</span>');
		
		show('editbox');
		$('editbox').style.left = e.x + "px";
		$('editbox').style.top = e.y + "px";
		$('textarea').value = str;
	}
}

function save() { 
	var val = $('textarea').value; 
	$('selected').outerHTML = val;
	hide('editbox');
}

</script>

</head>

<body>

<div id="edittext" onmousedown="handleDown();" >
把选择定内容增加到文本框
</div>