Simditor转义后页面无法正常显示,显示标签的解决办法

本文介绍了一个关于Simditor富文本编辑器的问题,即文本在页面上显示为标签而非正常文本的情况,并提供了解决方案,包括如何通过修改JS代码使文本正常显示。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

    Simditor是一个开源(MIT协议)的富文本编辑器,支持IE10+、Chrome、Firefox、Safari浏览器,只需要简单的配置就可以使用,功能精简,加载快速。

    Simditor文本经过转义后,存入数据库。在页面上展示时,却显示的是标签,而不是正常的文本。以下是解决的办法:

    1.转义的java代码如下:

    

    2.jsp页面显示的标签:

   3 浏览器页面显示的结果:


页面没有把正常的标签给显示出来,而是直接显示的是标签文本(如上图),所以需要在页面接收的时候需要用js转义下代码。今天这个方法就不用js转义代码。

    4.经过查看,浏览器不显示正常的标签是因为浏览器把标签的内容都当成字符串,所以不能正常显示标签(如下图):


    5.只需要在js中加两行代码就可以让内容正常显示:

    (1).jsp:代码:

<div id="editorContent" class="noticeDetailBody simditor-body hide">${ noticeDetail.contentHtml }</div>

需要加上一个hide的class,在刚开始加载页面的时候不显示数据,类似隐藏域。

    (2).JS代码:

var editor = $("#editorContent")[0];
$(editor).removeClass("hide").html(editor.textContent)

这样就可以让文本正常显示了。注意:有些版本的浏览器可能会出现不兼容的现象,只需要把textContent改为innerText就可以了,如下为正常显示的内容:


这样也可以防止xss的。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值