从富文本编辑器获取html内容组装json,特殊字符引起报错解决办法。

简介: 从富文本编辑器获取html内容组装json,特殊字符引起报错解决办法。

最近项目需要,需要从富文本编辑器获取html内容组装json,然后还要

把组装后的json对象利用json2转成json字符串,数据放入编辑器提交,由于兼容ie8以上浏览器。所以搞了好久的特殊字符转义,经常出错。我们一般想到的解决办法就是转义:

/*3.用正则表达式实现html转码*/
function htmlEncodeByRegExp(str){
    var s = "";
    if(str.length == 0) return "";
    s = str.replace(/&/g,"&");
    s = s.replace(/</g,"&lt;");
    s = s.replace(/>/g,"&gt;");
    s = s.replace(/ /g,"");
    s = s.replace(/\'/g,"&#39;");
    s = s.replace(/\"/g,"&quot;");
    s = s.replace(/\n"/g,"");
    s = s.replace(/\r"/g,"");
    return s;
}
/*4.用正则表达式实现html解码*/
function htmlDecodeByRegExp (str){
    var s = "";
    if(str.length == 0) return "";
    s = str.replace(/&amp;/g,"&");
    s = s.replace(/&lt;/g,"<");
    s = s.replace(/&gt;/g,">");
    s = s.replace(/&nbsp;/g," ");
    s = s.replace(/&#39;/g,"\'");
    s = s.replace(/&quot;/g,"\"");
    return s;
}


json字符串本身的引号 和 html里面的引号,在转码后没法区分哪些是数据格式,哪些属于从编辑器获取的Html里面的。
后来想到一种解决办法,就是对从富文本编辑器里面的内容进行base64编码,展示的时候再解码,就完全屏蔽掉了所有的特殊字符。
因此采用了jquery.base64.js.具体使用方法是:


编码

dec.val($.base64.btoa(this.value));
            // also possible:
            // dec.val( $.base64('encode', this.value) );
            // dec.val( $.base64.encode(this.value) );


解码



// note: you can pass a third parameter to use the utf8 en- / decode option
            enc.val($.base64.atob(this.value, true));
            // also possible:
            // dec.val( $.base64('decode', this.value) );
            // dec.val( $.base64.decode(this.value) );


相关文章
HTML输出特殊字符详细方法
以下是部分特殊字符代码表,它们的完整应用代码格式为:`&#××××;`用下面的四位数字替换×,将得到对应的符号。(注意:应用这些代码,编辑器应该切换到HTML模式)
|
5月前
|
资源调度 JavaScript Windows
yarn install命令报错解决办法-warning package-lock.json found.
yarn install命令报错解决办法-warning package-lock.json found.
97 0
|
4月前
|
JSON 前端开发 Java
利用Spring Boot处理JSON数据实战(包括jQuery,html,ajax)附源码 超详细
利用Spring Boot处理JSON数据实战(包括jQuery,html,ajax)附源码 超详细
56 0
|
4月前
|
JSON 数据格式
解决报错TypeError: Converting circular structure to JSON --> starting at object with constructor
解决报错TypeError: Converting circular structure to JSON --> starting at object with constructor
|
4月前
|
前端开发 JavaScript 安全
【网络安全/前端XSS防护】一文带你了解HTML的特殊字符转义及编码
【网络安全/前端XSS防护】一文带你了解HTML的特殊字符转义及编码
149 0
HTML常用的特殊字符大全
以下的页面中,罗列出了很多类别各式各样的特殊字符,通常你可以直接复制它们直接使用。
|
2月前
|
SQL 消息中间件 Java
Flink报错问题之使用debezium-json format报错如何解决
Apache Flink是由Apache软件基金会开发的开源流处理框架,其核心是用Java和Scala编写的分布式流数据流引擎。本合集提供有关Apache Flink相关技术、使用技巧和最佳实践的资源。
|
2月前
|
SQL Java 关系型数据库
flink问题之使用debezium-json format报错如何解决
Apache Flink是由Apache软件基金会开发的开源流处理框架,其核心是用Java和Scala编写的分布式流数据流引擎。本合集提供有关Apache Flink相关技术、使用技巧和最佳实践的资源。
48 0
|
4月前
|
小程序 API 定位技术
【uni-app报错】选择地址:fail the api need to be declared in the requiredPrivateInfos field in app/ext.json
【uni-app报错】选择地址:fail the api need to be declared in the requiredPrivateInfos field in app/ext.json
106 0
|
5月前
|
JSON 前端开发 数据格式
ajax请求模拟json数据并且拼接到html
ajax请求模拟json数据并且拼接到html
28 0