问题背景：表单长文本字段填写无引入富文本编辑器，使用textarea输入，打印表单时，将文本放至表格td内，无法保留textarea的内容格式。主要问题表现为：

①换行符变为空格展示，没有换行显示。

②多个空格变为单个空格显示。

问题解决：

/**

* 格式化文本为html标签

* contentId，需进行格式转换的元素ID

**/

function formatText(contentId){

var content = $('#' + contentId);

content.each(function(){

var txt = $(this).text();

//多个空格变成单个空格显示，所以需替换空格为

txt = txt.replace(new RegExp(' ', 'g'), ' ');

var j =0;

var span = document.createElement("span");

for(i=0;i

if(txt.charAt(i)=='\n'){

//以换行符做分割

var partTxt = txt.slice(j,i);

var p = document.createElement("p");

p.innerHTML = partTxt;

span.append(p);

//由于p标签内容为空时，页面不显示空行，加一个

if(partTxt==''){

span.appendChild(document.createElement("br"));

}

j = i + 1;

}

}

var p_end = document.createElement("p");

p_end.innerHTML = txt.slice(j);

$(this).text('');

span.appendChild(p_end);

$(this).append(span);

});

}

继续深入：在项目中有打印的需求，当文本内容过多时，需分页显示。这时就需要把文本切割为多个单行的p标签文本，再去计算文本高度进行分页。切割方法按照固定的文本长度进行截断，元素高度属性clientHeight。

/**

* 格式化文本为html标签，并切割为多个单行p标签文本

* contentId，需进行格式转换的元素ID

**/

function formatText(contentId){

var content = $('#' + contentId);

content.each(function(){

var txt = $(this).text();

var j =0;

var span = document.createElement("span");

for(i=0;i

if(txt.charAt(i)=='\n'){

//以换行符做分割

var partTxt = txt.slice(j,i);

var outFlag = false;//溢出标识

for (var z = 0; z < partTxt.length; z++) {

//p标签一行展示长度为31的字符

var startIndex = z * 31;//开始下标

var endIndex = (z + 1) * 31;//结束下标

if (endIndex > partTxt.length) {

endIndex = partTxt.length;

outFlag = true;

}

var pTxt = partTxt.slice(startIndex, endIndex);

pTxt = pTxt.replace(new RegExp(' ', 'g'), ' ');

var p = document.createElement("p");

p.innerHTML = pTxt;

span.append(p);

if (outFlag) {

break;

}

}

//由于p标签内容为空时，页面不显示空行，加一个

if(partTxt==''){

span.appendChild(document.createElement("br"));

span.appendChild(p);

}

j = i + 1;

}

}

var p_end = document.createElement("p");

p_end.innerHTML = txt.slice(j).replace(new RegExp(' ', 'g'), ' ');

$(this).text('');

span.appendChild(p_end);

$(this).append(span.innerHTML);//去除span标签

});

}