富文本编辑器的使用KindeItor（方便自己以后查阅）

「爱情、让人受尽委屈。」 2024-04-17 21:25 109阅读 0赞

1：首先下载kindeItor

2：将下载的文件夹引入自己的项目中

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNTgxMTU0_size_16_color_FFFFFF_t_70][]

3：在项目页面中引入：（前提是需要基准路基，第一个代码块是我设置的基准路径，第二个是导入kindeditor）

4：查看自己的版本：就打开kindeitor.js，发现是版本3

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNTgxMTU0_size_16_color_FFFFFF_t_70 1][]

5：搜索百度，查看官方文档：这里引入kinditor官方文档，直接照着例子复制黏贴就能使用了

[http://kindeditor.net/doc3.php][http_kindeditor.net_doc3.php]

6：如果出现不显示的情况，清空一下缓存。

简单的代码：（kinditor版本3）

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <html>
    <head>
        <title>Title</title>
        <base href="<%=request.getScheme()%>://<%=request.getServerName()%>:<%=request.getServerPort()%><%=request.getContextPath()%>/"/>
        <script type="text/javascript" src="js/jquery.js"></script>
        <script  src="editor/kindeditor.js"></script>
        <script type="text/javascript">
            KE.show({
                id : 'editor_id'
            });
        </script>
    
    
    
    </head>
    <body>
    <textarea id="editor_id" name="content" style="width:700px;height:300px;">
    <strong>HTML内容</strong>
    </textarea>
    </body>
    </html>

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNTgxMTU0_size_16_color_FFFFFF_t_70]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/72c20b3512a540f79d471649bc9ba0d7.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNTgxMTU0_size_16_color_FFFFFF_t_70 1]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/22eeb8f8432d42359f06f765aa3f00b1.png
[http_kindeditor.net_doc3.php]: http://kindeditor.net/doc3.php