700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > 获取富文本编辑器的纯文本内容

获取富文本编辑器的纯文本内容

时间:2020-11-05 17:08:35

相关推荐

获取富文本编辑器的纯文本内容

发布新闻等信息时,必然会用到富文本编辑器。然而我们在前端页面展示的时候,可能需要把内容文字提取出来,作为简介使用;又或者把图片提取一张作为封面图片使用。

解决方案;

1 提取文本或者封面图片存入数据库中

(1)在前端处理文字传给后台

这里我使用的是kindeditor编辑器,方法如下:

var text = editor.text();

alert这个值会发现,图片没有被处理掉,所以用js手动再次处理,方法如下:

function repalceHtml(str){str = str.replace(/<[^>]+>|&[^>]+;/g,"").trim();//去掉所有的html标签和&nbsp;之类的特殊符合return str;}text = repalceHtml(text);

把这个text传入后台即可。

(2)在Java端处理,前端不用处理

后台拿到内容之后,是一段html字符串,因此需要截取一下

截取文字方法如下:

public static String getHtmlText(String strHtml) {String txtcontent = strHtml.replaceAll("</?[^>]+>", ""); //剔出<html>的标签 txtcontent = txtcontent.replaceAll("<a>\\s*|\t|\r|\n|&nbsp;|</a>", "");//去除字符串中的空格,回车,换行符,制表符 return txtcontent; }

截取图片src方法如下:

public static List<String> getImageSrc(String htmlStr) {List<String> pics = new ArrayList<String>();String img = "";String a = "";Pattern p_image;Matcher m_image;//String regEx_img = "<img.*src=(.*?)[^>]*?>"; //图片链接地址String regEx_img = "<img.*src\\s*=\\s*(.*?)[^>]*?>";p_image = pile(regEx_img, Pattern.CASE_INSENSITIVE);m_image = p_image.matcher(htmlStr);while (m_image.find()) {// 得到<img />数据img = m_image.group();// 匹配<img>中的src数据Matcher m = pile("src\\s*=\\s*\"?(.*?)(\"|>|\\s+)").matcher(img);while (m.find()) {pics.add(m.group(1));}}return pics;}

调用方法:

if(!StringUtils.isEmpty(validationIndicators.getContents())){//处理图片List<String> list = GetSrcUtils.getImageSrc(validationIndicators.getContents());if(list!=null&&list.size()>0){validationIndicators.setImg(list.get(0));}//处理文字String text = GetHtmlTextUtils.getHtmlText(validationIndicators.getContents());validationIndicators.setZy(text);}

2.展示页面的时候,直接在前端处理

前端拿到json字符串之后,遍历的时候,手动处理一下,依赖的依然是同一个js方法。

function repalceHtml(str){str = str.replace(/<[^>]+>|&[^>]+;/g,"").trim();//去掉所有的html标签和&nbsp;之类的特殊符合return str;}text = repalceHtml(text);

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。