需求:在textarea中输入文字,提交给后台后,后台输出在另一个页面,文字按原格式显示。
<textarea name="" id="test_new_line" cols="30" rows="10"></textarea>
<input type="button" id="submit" value="提交"/>
<div id="result"></div>
js:
document.getElementById("submit").onclick = function(){
var newString = document.getElementById("test_new_line").value.replace(/\n/g, '_@').replace(/\r/g, '_#');
document.getElementById("result").innerHTML = newString;
};
输入:
![关于textarea中换行、回车、空格的识别与处理 - helloiamkitty - 单骑邮差](http://img2.ph.126.net/6FIIYqeRe8saScGfugAXmg==/6597487581075338792.jpg)
document.getElementById("submit").onclick = function(){
var newString = document.getElementById("test_new_line").value.replace(/\n/g, '_@').replace(/\r/g, '_#');
newString = newString.replace(/_#_@/g, '<br/>');//IE7-8
newString = newString.replace(/_@/g, '<br/>');//IE9、FF、chrome
newString = newString.replace(/\s/g, ' ');//空格处理
document.getElementById("result").innerHTML = newString;
};
![关于textarea中换行、回车、空格的识别与处理 - helloiamkitty - 单骑邮差](http://img2.ph.126.net/Y_vpOhvJixLGlUPN6nt4fA==/6597136836867647692.jpg)
![关于textarea中换行、回车、空格的识别与处理 - helloiamkitty - 单骑邮差](http://img5.ph.126.net/-asDlipcW7o6zWXdbK67aA==/6598059327121816535.jpg)
![关于textarea中换行、回车、空格的识别与处理 - helloiamkitty - 单骑邮差](http://img6.ph.126.net/cuhQDw8ch8zrocuI7Wq5Vw==/6597715179982532306.jpg)