富文本编辑器KindEditor在前端JS的应用

1.引入KindEditor资源包

2.页面引入Js,Css文件

3.html代码&＃xff1a;

讲师信息

4.Jq代码&＃xff1a;

初始化编辑器&＃xff1a;

//富文本编辑框
var editor;
function onEditText() {KindEditor.ready(function (K) {editor &＃61; K.create(&＃39;#cot_detail&＃39;, {resizeType: 0,width: "80%",height: "340px",items: [&＃39;source&＃39;, &＃39;|&＃39;, &＃39;undo&＃39;, &＃39;redo&＃39;, &＃39;|&＃39;, &＃39;preview&＃39;, &＃39;cut&＃39;, &＃39;copy&＃39;, &＃39;paste&＃39;,&＃39;plainpaste&＃39;, &＃39;wordpaste&＃39;, &＃39;|&＃39;, &＃39;justifyleft&＃39;, &＃39;justifycenter&＃39;, &＃39;justifyright&＃39;,&＃39;justifyfull&＃39;, &＃39;insertorderedlist&＃39;, &＃39;insertunorderedlist&＃39;, &＃39;indent&＃39;, &＃39;outdent&＃39;, &＃39;clearhtml&＃39;, &＃39;quickformat&＃39;, &＃39;selectall&＃39;, &＃39;|&＃39;, &＃39;fullscreen&＃39;, &＃39;/&＃39;,&＃39;formatblock&＃39;, &＃39;fontname&＃39;, &＃39;fontsize&＃39;, &＃39;|&＃39;, &＃39;forecolor&＃39;, &＃39;hilitecolor&＃39;, &＃39;bold&＃39;,&＃39;italic&＃39;, &＃39;underline&＃39;, &＃39;strikethrough&＃39;, &＃39;lineheight&＃39;, &＃39;removeformat&＃39;, &＃39;|&＃39;, &＃39;image&＃39;, &＃39;multiimage&＃39;, &＃39;media&＃39;,&＃39;insertfile&＃39;, &＃39;table&＃39;, &＃39;emoticons&＃39;, &＃39;baidumap&＃39;,&＃39;anchor&＃39;, &＃39;link&＃39;, &＃39;unlink&＃39;]});});
}

绑定值&＃xff1a;

editor.html($.Base64Decode(js.Cot_detail));

获取值&＃xff1a;

editor.sync();//富文本编辑器同步数据
cot_detail: $.Base64Encode($("#cot_detail").val())

注意&＃xff1a;因为富文本编辑器内的字符中可能有换行等&＃xff0c;如果不base64可能会json报错