wangEditor 富文本框

富文本框：https://www.kancloud.cn/wangfupeng/wangeditor3/335774；

接受服务端传输的数据显示到富文本框中：

<div  id="textBox1" style="width:250px"></div>
<div  id="edit" style="width:453px"></div>

服务端出过来的数据样式：

"&lt;p&gt;&lt;img src=&quot;http:&#47;&#47;img.t.sinajs.cn&#47;t4&#47;appstyle&#47;expression&#47;ext&#47;normal&#47;40&#47;pcmoren_tian_org.png&quot; alt=&quot;[舔屏]&quot; data-w-e=&quot;1&quot;&gt;&lt;img src=&quot;http:&#47;&#47;img.t.sinajs.cn&#47;t4&#47;appstyle&#47;expression&#47;ext&#47;normal&#47;3c&#47;pcmoren_wu_org.png&quot; alt=&quot;[污]&quot; data-w-e=&quot;1&quot;&gt;&lt;
img src=&quot;http:&#47;&#47;
img.t.sinajs.cn&#47;t4&#47;appstyle&#47;expression&#47;ext&#47;normal&#47;50&#47;pcmoren_huaixiao_org.png&quot; alt=&quot;[坏笑]&quot; data-w-e=&quot;1&quot;&gt;&lt;br&gt;&lt;&#47;p&gt;&lt;h1&gt;dasdasdsadas14654156156&lt;&#47;h1&gt;&lt;p&gt;eqwdoewdpeqwdwq&lt;&#47;p&gt;&lt;p&gt;dsadsad75er452&lt;
img src=&quot;http:&#47;&#47;
img.t.sinajs.cn&#47;t35&#47;style&#47;images&#47;common&#47;face&#47;ext&#47;normal&#47;60&#47;horse2_thumb.gif&quot; alt=&quot;[神马]&quot; data-w-e=&quot;1&quot;&gt;&lt;&#47;p&gt;&lt;p&gt;&lt;
img src=&quot;http:&#47;&#47;
img.t.sinajs.cn&#47;t35&#47;style&#47;images&#47;common&#47;face&#47;ext&#47;normal&#47;7a&#47;shenshou_thumb.gif&quot; alt=&quot;[草泥马]&quot; data-w-e=&quot;1&quot;&gt;&lt;br&gt;&lt;&#47;p&gt;"

要转成如下HTML：

<p><img src="http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/40/pcmoren_tian_org.png" alt="[舔屏]" data-w-e="1"><img src="http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/3c/pcmoren_wu_org.png" alt="[污]" data-w-e="1"><img src="http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/50/pcmoren_huaixiao_org.png" alt="[坏笑]" data-w-e="1"><br></p><h1>dasdasdsadas14654156156</h1><p>eqwdoewdpeqwdwq</p><p>
dsadsad75er452<img src="http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/60/horse2_thumb.gif" alt="[神马]" data-w-e="1"></p><p><img src="http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/7a/shenshou_thumb.gif" alt="[草泥马]" data-w-e="1"><br></p>

 <script>
                       var E = window.wangEditor;
                        var editor2 = new E('#textBox1','#edit')
                        editor2.customConfig.zIndex = 100;
                        // editor2.
                        let a='{*utils.str_escape_by_json(approval_info.apply_info.reason)*}';
      // 关闭粘贴样式的过滤
      //editor.customConfig.pasteFilterStyle = false
    // 忽略粘贴内容中的图片
    //editor.customConfig.pasteIgnoreImg = true
    // 自定义处理粘贴的文本内容
    //editor.customConfig.pasteTextHandle = function (content) {
        // content 即粘贴过来的内容（html 或 纯文本），可进行自定义处理然后返回
       // return content + '<p>在粘贴内容后面追加一行</p>'
    }
                        editor2.create();
                     // 轉HTML樣式
                        editor2.txt.html((a).replace(/&#47;/g, "/").replace(/&lt;/g, "<").replace(/&gt;/g, ">").replace(/&amp;/g, "&").replace(/&quot;/g, '"').replace(/&apos;/g, "'"));
                        editor2.$textElem.attr('contenteditable', false);
    </script>

wangEditor 富文本框

猜你喜欢