kindeditor使用的关键点

简介:
在页面使用kindeditor编辑器时,有以下步骤:

    [1]下载kindeditor压缩包       
    下载地址 :http://kindeditor.googlecode.com/files/kindeditor-4.1.9.zip

    [2]在项目中引入kindeditor文件夹,如下图:

    [3]在页面中如edit.jsp中引入kindeditor.js

    <script type="text/javascript" charset="UTF-8" src="../js/jquery-1.4.2.min.js"></script>
    <script charset="utf-8" src="../common/kindeditor/kindeditor.js"></script>
    <script charset="utf-8" src="../common/kindeditor/lang/zh_CN.js"></script>

    [4]创建一个textarea,如下:
         <td width="15%" height="28">内容<span style="color: red">*</span></td>
                    <td height="35" colspan="3">
                         <textarea id="PCONTENT" name="PCONTENT" rows="60"
                        style="width:90%; margin:0 auto; background:url(../images/biaodan/textarea_bg.gif)                             repeat-x #fff; border:1px solid #CDCDCD; overflow:auto;">
                         </textarea>
          </td>

    [5]在页面加载完成后,出事后编辑器
<script>
        KindEditor.ready(function(K) {
                window.editor = K.create('#PCONTENT');
        });
</script>

    至此,kindeditor就能生效了。
    如果运行正常,效果如下:
   
      但是,如果你不是用php开发系统的话,那么,你的图片上传是不能使用的,因为kindeditor中默认的使用的是php作为action。
    下面说明文件上传的配置:(以jsp开发为例)
    [6]在plugin/image.js中修改,上传处理的action路径
    找到选中的部分

替换成:
这样就是用jsp/upload_json.jsp来处理文件的上传。

        [7]配置上传文件路径
打开jsp/upload_json.jsp文件,找到如下位置:

配置为你对应的目录即可,注意文件保存路径和访问路径的一致性。
当然,这个目录需要在context下面,注意路径就可以了。

    
    图片上传功能,其实不用配置也可以实现,就是在编辑器初始化时,直接设置,如下:

  
  
KindEditor.ready(function(K) {
window.editor = K.create('#PCONTENT',{
uploadJson:'../common/kindeditor/jsp/upload_json.jsp',
fileManagerJson:'../common/kindeditor/jsp/file_manager_json.jsp',
allowFileManager : true
});
});
根据需要配置upload_json.jsp中的文件的文件上传路径,如果用默认的,需要在应用的根目录下面创建attached目录。
如果配置量文件上传的路径,需要注意upload_json.jsp和file_manager_json.jsp两个文件中配置的一致性。


本文转自博客园zhyiwww 的博客,原文链接:http://www.blogjava.net/zhyiwww/,如需转载请自行联系原博主。

目录
相关文章
Win10 汇编工具 EMU8086安装教程
EMU8086是一种学习汇编工具,它结合了一个原始编辑器、组译器、反组译器、具除错功能的软件模拟工具(虚拟PC),还有一个循序渐进的指导工具。下面的这一教程是 bs.aiesst.cn 专门为初学者入门而准备的一个安装教程,以及下载地址。
8571 1
|
5月前
|
JSON 数据挖掘 API
竞品分析新思路:通过淘宝API批量获取商品评论数据
淘宝商品评论API是淘宝开放平台提供的数据接口,支持通过编程获取商品的文字、图片、视频评论及相关评分、用户昵称和评论时间等信息。接口遵循RESTful原则,支持GET/POST请求和JSON格式返回,适用于电商分析、用户行为研究等场景。可按评分、时间筛选评论,并支持分页与排序,主要参数包括商品ID、页码、每页条数及返回字段等。
|
7月前
|
人工智能 安全 自动驾驶
通义灵码入职蔚来汽车,AI生成代码30%以上
通义灵码已正式应用于蔚来汽车智能座舱部门,近400名成员使用该工具,AI生成代码占比达30%以上,“天探”项目中甚至高达70%-80%。它通过提升代码开发效率、降低维护成本、智能生成单元测试及问题排查等功能助力研发。蔚来选择通义灵码看重其企业专属版的安全能力和知识管理功能。未来,期望AI编程将研发流程规范化,成为类似自动驾驶的高效指引工具。
337 5
|
10月前
|
安全 虚拟化 Windows
Windows Server 2016 中文版、英文版下载 (2025 年 2 月更新)
Windows Server 2016 中文版、英文版下载 (2025 年 2 月更新)
341 17
Windows Server 2016 中文版、英文版下载 (2025 年 2 月更新)
|
9月前
|
存储 编解码 安全
阿里云高性能企业级甄选Intel第八代计算型c8i、通用型g8i和内存型r8i实例简介
计算型c8i、通用型g8i和内存型r8i实例是阿里云推出的高性能企业级甄选Intel第八代云服务器实例,采用CIPU+飞天技术架构,搭载最新的Intel 第五代至强可扩展处理器(代号EMR),性能进一步大幅提升,同时拥有AMX加持的AI能力增强,并在全球范围率先支持TDX机密虚拟机能力,实现了AI增强和全面安全防护的两大特色优势。本文将为您介绍这三个实例规格的性能、适用场景及最新活动价格以及选择指南,以供选择参考。
388 18
|
前端开发 JavaScript Java
杨老师教你学会使用富文本编辑器KindEditor之添加页面设计
杨老师教你学会使用富文本编辑器KindEditor之添加页面设计
415 0
|
存储 传感器 算法
如何选择合适的 CRC 多项式
CRC(循环冗余校验)多项式的选取对数据传输的错误检测至关重要。选择时需考虑多项式的长度、检测性能及实现复杂度,常用多项式有CRC-8、CRC-16、CRC-32等,适用于不同场景以确保高效准确的错误检测。
1262 4
|
Nacos 微服务
Nacos与Eureka的区别
Eureka和Nacos均支持服务注册发现、基于心跳的健康检查及AP模式下的集群数据同步。主要区别在于:心跳频率、服务剔除机制、服务检测与清理周期不同,Nacos还额外提供配置管理功能。
487 0
Simulink|局部遮荫下光伏组件多峰值PSO-MPPT控制
Simulink|局部遮荫下光伏组件多峰值PSO-MPPT控制