在此之前我一直都是在用FCKEditor在线编辑器，当然也有用过其它在线编辑器如eWebEditor,tinyMCE,CuteEditor，jHtmlArea等等，但在最终项目发布的时候并没有采用它们，因为它们要不是皮肤呆板，就是配置太烦琐，或是功能太少、浏览器兼容性不好等等。去年一个偶然的机会让我认识了KindEditor这款在线编辑器，正如它的名字那样这是款友好的编辑器，它不仅体积小配置简单，而且功能与皮肤也是令人相当的振憾。还有个很重要的因素，它是我们国人的开发的免费工具，从产品发布至今更新脚步未曾停止哦。下面就会大家介绍下经过我完善后的KindEditor吧。
目前官方网站已经将KindEditor更新到了3.5.2版， 从3.4的版本开始官方就去除了一些不常用的功能改用plugin形式来丰富KindEidtor，这就为我们打造个性的插件奠定了基础。其实只要是你的JS基础够扎实，花点时间看看KindEditor的源码，你就完全可以在其原有的基础上完善出你所想要的功能。下面是我的完善记录：
1.集合了日期、时间、在线预览和特殊字符插件,采用3.0皮肤；
2.将图片上传与管理的JSP页面改写成SERVLET，同时去除JSON包；
3.添加图片压缩功能，对超出的宽高压缩成指定的值；
4.添加上传附件功能；
5.添加图片、附件按日期文件夹分类管理的功能；
6.添加上传图片、附件的title属性，缺省为原文件名；
7.添加上传附件相关的初始属性
8.修改从word粘贴样式，减少样式。
关于如何使用我就不多说了，官方网站上有详细的API，文章最后我也会给出经我完善的KindEditor还有Demo，先来看看效果吧。
完善后的KE目录
完善后的效果1
完善后的效果2
附件上传效果
在线预览效果
KE、Struts2与Extjs3.3整合效果
最后要说的是这款编辑器真的很不错，相信你用过它后一定会喜欢上它的，呵呵，多多支持国内软件事业的发展吧
相关推荐
2. **导入组件**：在Vue组件中引入KindEditor，并注册为本地组件。 ```javascript import KindEditor from 'vue-kindeditor' export default { components: { KindEditor } } ``` 3. **使用组件**：在...
2. **设置编辑器实例**: 创建KindEditor实例，指定编辑器的ID和一些基本配置。例如： ```javascript KindEditor.create('#editor-id', { width: '100%', height: '500px', items: ['source', '|', 'video'], }...
2. **自定义工具栏**： 描述中提到的“可以自定义工具按钮”是KindEditor的一大特色。开发者可以根据项目需求，选择显示或隐藏默认工具栏中的各项功能，甚至添加自定义的按钮，以满足特定场景下的使用需求。 3. **...
Kindeditor-v4.0.6 Struts2修订版是一个针对KindEditor编辑器与Struts2框架集成时出现的文件上传问题进行修复的版本。在原版的KindEditor中，当它与Struts2框架整合时，可能会遇到上传功能无法正常工作的情况。这...
2、复制struts需要的jar包和kindEditor必须jar包到lib下，因为它们的jar包邮重复，选择最新的就ok 3、如果需要后台java代码获取内容，可以在action中定义content属性，getContent就可以获取到 需要注意的是，这里的 ...
2. **jQuery 集成**：`jquery.min.js` 提供了 jQuery 库，KindEditor 可以与 jQuery 配合使用，使得开发者可以利用 jQuery 的强大选择器和事件处理能力来操作和扩展编辑器。 3. **自动处理脚本**：`auto.js` 可能是...
1. **跨浏览器兼容性**：KindEditor设计之初就考虑了多种浏览器的兼容性，支持包括IE6+、Firefox、Chrome、Safari和Opera在内的主流浏览器，确保用户在不同的环境下都能获得一致的编辑体验。 2. **丰富的编辑功能**...
2. **配置KindEditor**：将下载的KindEditor文件夹上传到你的Web应用的静态资源目录下，例如`/WEB-INF/resources/js/kindeditor`。配置编辑器的初始化参数，包括路径设置、语言选择、工具栏定制等。在HTML页面中，...
KindEditor ASP.NET 本ASP.NET程序是演示程序，建议不要直接...2. 将kindeditor/asp.net/bin目录下的dll文件复制到wwwroot/bin目录下。 3. 打开浏览器，输入http://localhost:[P0RT]/kindeditor/asp.net/demo.aspx。
2. **使用Ajax改造上传**：由于KindEditor默认的上传方式可能不支持自定义token，我们需要自定义上传逻辑。在`beforeUpload`回调函数中，我们可以使用原生的XMLHttpRequest或者现代浏览器的fetch API来发送带有token...
#### 二、环境准备 在开始配置之前，请确保已经安装并正确引入了以下文件： 1. **kindEditor核心文件**：`kindeditor.js` 2. **语言包文件**：`lang/zh_CN.js`（如果使用中文环境） 3. **主题样式文件**：`themes/...
2. **KindEditor的视频上传功能**： 类似于图片上传，KindEditor也支持视频文件的上传。在这个案例中，提到了参考`media.js`来实现视频上传。`media.js`是KindEditor处理媒体资源（如视频）的核心脚本。它处理用户...
2. **监听paste事件**：接下来，需要在KindEditor的JavaScript文件中添加监听“paste”事件的代码，一旦检测到用户执行了粘贴操作，就会触发事先定义好的处理函数。 3. **处理函数**：处理函数的主要任务是阻止默认...
2. 使用JavaScript图像处理库读取图片数据并进行压缩。 3. 压缩后的图片数据会被重新转换为适合上传的格式，并发送到服务器。 4. 服务器端可能也需要相应的处理，比如接收压缩后的图片，保存到服务器，并返回一个较...
【标题】"kindeditor多图上传H5版" 涉及的知识点： 1. **KindEditor**：KindEditor是一款开源的JavaScript富文本编辑器，它提供了丰富的API和可定制的功能，广泛应用于网页内容编辑。在传统的KindEditor中，图片...
2. **Ajax异步请求**：在线搜索功能的实现通常涉及到Ajax技术，通过向指定的搜索引擎发送异步请求，获取搜索结果。这需要熟悉XMLHttpRequest对象或现代浏览器的fetch API，以及JSON数据格式的解析。 3. **前端安全*...
2. **KindEditor API**：学习KindEditor的API，包括如何添加自定义插件，如何监听事件，以及如何定制编辑器的样式和行为。 3. **JMEditor集成**：了解JMEditor的使用方法，包括如何加载编辑器、设置LaTeX语法支持，...
2. **图片上传和管理**：用户可以上传本地图片到服务器，并在编辑器中进行调整大小、浮动等操作。 3. **链接创建**：支持添加内部链接、外部链接及电子邮件链接。 4. **插入HTML元素**：包括表格、分隔线、特殊字符...
2. 创建ExtJS组件：定义一个面板（Panel）或者其他合适的组件，作为KindEditor的容器。 3. 初始化KindEditor：在ExtJS的回调函数中，使用KindEditor的API来初始化编辑器，指定容器元素（通常是ExtJS组件的DOM元素）...