textarea文本保存到数据库,前端输出保存换行回车解决方案


处理这种文本输出格式的,使用富文本编辑器是比较方便的,但我这里写的不是使用富文本编辑器的处理方法!     


那么,从数据库取出text文本到前端展示格式一致的解决方案主要有两种(仅Web端,其他平台没有调试):


一:提交数据之前,将textarea的回车、空格先转换格式,再提交数据存入数据库,那样取出数据输出到web端也能保证格式一致。


//关键js代码

var text = $("textarea").text(); 

var des = text.replace(/\r\n/g, '
').replace(/\n/g, '
').replace(/\s/g, ' '); //转换格式

//将des文本内容存入数据库

//取出渲染视图即可 

 


二:当数据库存储的是原生的textarea文本,这时候,输出到前端前需要解析文本。


 


前提:textarea文本上传到后台时已经包含了换行回车符,如果你发现textarea上传时没有保存换行回车,可以尝试设置textarea标签属性wrap="hard"(html5支持)


 


        $(function() {

init();

});

 

function init() {

var text = $("div.text").text(); //先取出未转换格式前端数据

var des = text.replace(/\r\n/g, '
').replace(/\n/g, '
').replace(/\s/g, ' ');  //转换格式

$("div.text").empty(); 

$("div.text").append(des);

}

 


ps:建议使用$("div.text").empty(); $("div.text").append(des); 替换为转换格式后的前端文本,


       不要直接使用$("div.text").text(des); 替换文本;因为text方法会指定内容为text,那么
标签会被直接输出而不会浏览器解析为换行!


热门文章

  • 体育总局冬运中心关于选派2023-2024赛季全国高山滑雪冠军赛技术官员的函
  • 体育总局冬运中心关于公示第十四届全国冬季运动会冬季两项项目参赛运动员名单的函
  • 中国滑雪协会关于发布全国滑雪俱乐部精英联赛(吉林站)竞赛规程的通知
  • 体育总局冬运中心关于第十四届全国冬季运动会冬季两项项目替换运动员的通知
  • 体育总局冬运中心关于公布第十四届全国冬季运动会单板滑雪U型场地等项目决赛参赛运动员名单的通知
  • 体育总局冬运中心关于公布第十四届全国冬季运动会冬季两项项目参赛运动员名单的通知
  • 体育总局冬运中心关于取消举办2023-2024赛季全国冬季两项冠军赛的通知
  • 体育总局冬运中心关于选派裁判员参加2023-2024赛季单板滑雪平行项目全国冠军赛暨国际雪联FIS积分赛的函
  • 中国滑雪协会关于全国滑雪俱乐部精英联赛(吉林站)的补充通知
  • 2023-2024赛季全国跳台滑雪冠军赛竞赛规程
  • 2023-2024赛季全国高山滑雪冠军赛竞赛规程
  • 体育总局冬运中心关于选派2023-2024赛季全国高山滑雪锦标赛暨第十四届全国冬季运动会高山滑雪资格赛技术官员的函
  • 体育总局冬运中心关于发布2023-2024赛季全国自由式及单板滑雪U型场地冠军赛竞赛规程的通知
  • 体育总局冬运中心关于发布2023-2024赛季全国自由式及单板滑雪大跳台和坡面障碍技巧冠军赛竞赛规程的通知
  • 体育总局冬运中心关于公示第十四届全国冬季运动会越野滑雪项目参赛运动员名单的函