1. 在官网上下载KindEditor文件，可以删掉不需要要到的jsp，asp，和php文件夹。接着把文件夹放到项目文件目录下。
2. 修改html文件，在页面引入js文件：
<script type="text/javascript" src="./kindeditor/kindeditor-all.js"></script><script type="text/javascript" src="./kindeditor/lang/zh-CN.js"></script>
3.在需要显示编辑器的位置添加textarea输入框,这里以一个页面创建两个编辑器为例：
注意：后面kindeditor是根据html标签的id或class来初始化的，所以id或class一定要是唯一的，否则只在第一个textarea标签上创建重复的kindeditor
<textarea class="keditor1" name="content" style="width:700px;height:300px;"><strong>HTML内容</strong></textarea><textarea> class="keditor2" name="content" style="width:700px;height:300px;"><strong>HTML内容</strong></textarea>
4.初始化kindeditor编辑器：
参考网上大部分的写法是：
var editor1;KindEditor.ready(function(K) { editor = K.create('.keditor1', {});});var editor2;KindEditor.ready(function(K) {editor = K.create('.keditor2', {});});
但是我用这种方法不能进入kindEditor.ready方法，无法成功创建初始化。
最后：
// 初始化var editor1 = KindEditor.create('.keditor1',keditOptions(KindEditor));var editor2 = KindEditor.create('.keditor2',keditOptions(KindEditor));pasteImg(editor2.edit.doc, editor2, KindEditor);changeKE(editor2);
5.配置项
// 富文本编辑器配置项function keditOptions(KindEditor){return{minHeight: 50,filterMode: false, //true时根据 htmlTags 过滤HTML代码，false时允许输入任何代码。resizeType : 0, //2时可以拖动改变宽度和高度，1时只能改变高度，0时不能拖动。themeType : 'simple', //指定主题风格，可设置”default”、”simple”items : ['emoticons', 'image'],autoHeightMode: true, // 引入autoheight.js插件时自动调整高度readonlyMode : true,// useContextmenu : false,pasteType: 1, // 设置粘贴类型，0:禁止粘贴, 1:纯文本粘贴, 2:HTML粘贴cssData: 'body, td {color:#333;font:14px/1.5 "Microsoft Yahei",tahoma,verdana,helvetica;}', // 编辑器字体样式// 多个标签元素cssData: 'body, td {overflow: hidden;padding: 0;color:#333;font:14px/1.5 "Microsoft Yahei",tahoma,verdana,helvetica;} p {margin-top:0;}', // 编辑器字体样式afterChange : function () { //输入文字事件var thisEditor = this;setTimeout(function () {var autoheight = KindEditor.IE ? thisEditor.edit.doc.body.scrollHeight : thisEditor.edit.doc.body.offsetHeight; //判断是否是IE，并获取内容高度thisEditor.edit.setHeight(autoheight); //设置高度}, 1000);},afterCreate:function(){this.sync();},afterBlur: function(){this.sync();}}}
6.图片粘贴参考文档：/sinat_36521655/article/details/105393820
kindeditor粘贴图片时base64格式，字符太长，所以想改成粘贴时调用上传文件接口，保存接口返回的url地址。
图片粘贴兼容IE和谷歌浏览器
// 处理图片，粘贴后保存格式为带有url地址的img标签function pasteImg(editerDoc, editor, KindEditor){var thisEditerDoc = editerDoc;//得到编辑器的文档对象var formData;$(thisEditerDoc).bind('paste', null, function (e) {// 谷歌浏览器if(KindEditor.WEBKIT) {// 获得操作系统剪切板里的项目，e即kindeditor,kindeditor创建了originalEvent(源事件)对象，并指向了浏览器的事件对象，// chrome浏览器需要通过clipboardData(剪贴板数据)对象的items,获得复制的图片数据。var ele = e.originalEvent.clipboardData.items;for (var i = 0; i < ele.length; ++i) {//判断文件类型if (ele[i].kind == 'file' && ele[i].type.indexOf('image/') !== -1) {var file = ele[i].getAsFile();//得到二进制数据//创建表单对象，建立name=value的表单数据。formData = new FormData();formData.append("file", file);//name,valueuploadPasteImg(formData, editor);}}}// IE浏览器或火狐浏览器if(KindEditor.GECKO || KindEditor.IE) {// IE粘贴板数据clipboardData在全局对象中，通过clipboardData对象的files获得复制的图片var files = (window.clipboardData || event.clipboardData).files || [];for (let i = 0; i < files.length; ++i) {//判断文件类型if (/^image\//.test(files[i].type)) {//得到二进制数据，并上传formData = new FormData();formData.append("file", files[i], "image.png");//name,valueuploadPasteImg(formData, editor);}}}})}function uploadPasteImg(formData, editor) {//用jquery Ajax 上传二进制数据var fileUrl = ""; // 上传文件接口地址ajaxApi(false, fileUrl, formData, "", function(data, isSuccess, resp) {//上传完之后，生成图片标签回显图片var src = fileDomain + data[0].original;var imgTag = "<img src='" + src + "' border='0' style='max-width:592px'/>";editor.insertHtml(imgTag);},{contentType: false,processData: false,error : function(jqXHR, textStatus, errorThrown) {layer.alert("文件上传失败:"+jqXHR.status, {icon : 2,shade : 0.1});}});}
// 富文本编辑器可编辑function changeKE(editor){editor.readonly(false); // 取消只读}
