<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="jquery-3.3.1.min.js"></script>
<script type="text/javascript">
//在光标处插入字符串
// myField    文本框对象
// myValue 要插入的值
function insertAtCursor(myField, myValue)
{
    //IE support
    if (document.selection)
    {
        myField.focus();
        sel            = document.selection.createRange();
        sel.text    = myValue;
        sel.select();
    }
    //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)
        {
            // restore previous scrollTop
            myField.scrollTop = restoreTop;
        }
        myField.focus();
        myField.selectionStart    = startPos + myValue.length;
        myField.selectionEnd    = startPos + myValue.length;
    } else {
        myField.value += myValue;
        myField.focus();
    }
}
function replace(strValue){
	return strValue.replace(/\r\n/g, '<br/>').replace(/\n/g, '<br/>').replace(/\s/g, '&nbsp;');
}
	$(function(){
		$("#btn").click(function(){
			insertAtCursor($("#area").get(0),$("input[name=content]").val());
			
		});
		
		$("#get").click(function(){
			alert(replace($("#area").val()));
			
		});
		
	});



</script>
</head>
<body>
<button id="btn">在光标后追加</button>
要追加的内容:<input name="content">
<textarea id="area" style="width: 400px;height: 300px;"></textarea>
<button id="get">获取带换行符的textarea内容</button>
</body>
</html>