KindEditor介绍:

kindEditor是一款国产富文本编辑器,类似fckeditor和目前比较流行的百度Ueditor。其产品官方网站为http://kindeditor.net/

KindEditor下载:

官网下载地址:(可能无法下载到历史版本)

http://kindeditor.net/down.php

Google下载地址:

https://code.google.com/p/kindeditor/downloads/list

KindEditor使用:

注意:本文使用的实例是用的 kindeditor-4.1.10 版本(下载地址:http://down.admin5.com/qita/8893.html),

本文以 文章添加修改查看 的业务流程来实现演示整个应用过程。

1:解压下载的压缩包到kindeditor目录下;

2:将kindeditor文件夹复制到项目中,如"/webroot/"下;可以把php,asp,asp.net三个目录删掉。导入后的目录结构如下所示:

3:将kindeditor/jsp/lib/下的所有jar包引入到工程中。(此版本为3个jar包,最好是使用拷贝到WEB-INF/lib下引用);

4:在需要用到文本编辑器的JSP页面的head部分引用js文件(add.jsp edit.jsp)

示例代码如下:

  1. <script type="text/javascript" charset="utf-8" src="${context}/kindeditor/kindeditor.js"></script>
  2. <script charset="utf-8" src="<span style="font-family: Arial, Helvetica, sans-serif;">${context}</span><span style="font-family: Arial, Helvetica, sans-serif;">/</span><span style="font-family: Arial, Helvetica, sans-serif;">kindeditor/lang/zh_CN.js"></script></span>
  3. <script>
  4. KindEditor.ready(function(K) {
  5. K.create('#editor_id', {
  6. uploadJson : '${context}/kindeditor/jsp/upload_json.jsp',
  7. fileManagerJson : '${context}/kindeditor/jsp/file_manager_json.jsp',
  8. allowFileManager : true
  9. });
  10. });
  11. </script>

注:${context}为上下文路径。

5:add.jsp 在要插入文本编辑器的部分插入如下代码:

  1. <textarea id="editor_id" name="content" style="width:96%;height:350px;visibility:hidden;"></textarea>

注:textarea的id属性值必须和head标签内定义的K.create()中的保持一致。name属性即为后台接受参数名称的值。

6:editor.jsp 在要插入文本编辑器的部分插入如下代码:

  1. <textarea id="editor_id" name="content" style="width:96%;height:350px;visibility:hidden;">${WenZhang.content}</textarea>

注:${WenZhang.content}是要编辑的内容。

7:show.jsp 展示页面直接展示数据库存放内容即可。

KindEditor在eclipse里的配置方法的更多相关文章

  1. 关于JDK+Tomcat+eclipse+MyEclipse的配置方法

    说一下关于JDK+Tomcat +eclipse+MyEclipse的配置方法: 1.jdk的配置 我用的是jdk1.6版本,与jdk1.5方法相同.执行完安装程序后就要在进行一下配置,步骤如下:右键 ...

  2. Eclipse里Maven配置

    简单记录一下,太特么困了,这几天天天加班很晚来着 : 选中.Apply and Close. 完成. 日他得,腰都快加断了……:) ---------------------------------- ...

  3. Eclipse插件SVN配置

    Eclipse插件SVN配置 方法一 打开Eclipse点击[Help]-[Install New Software] 点击右边[Add]-在弹出窗口中输入 Name:svn Location:htt ...

  4. (转) 在Eclipse中进行C/C++开发的配置方法(20140721最新版)

    本文转载自:http://blog.csdn.net/baimafujinji/article/details/38026421 Eclipse 是一个开放源代码的.基于Java的可扩展开发平台.就其 ...

  5. 转:在Eclipse中进行C/C++开发的配置方法(20140721最新版)

    http://blog.csdn.net/baimafujinji/article/details/38026421 Eclipse 是一个开放源代码的.基于Java的可扩展开发平台.就其本身而言,它 ...

  6. 于Eclipse传导C/C++配置方法开发(20140721新)

    Eclipse 它是一个开源.基于Java可扩展的开发平台. 在其自己的.它只是一个框架和一组服务.对于通过插件组件构建开发环境. --从百度百科的短语. 简单的说Eclipse 是免费的开源的Jav ...

  7. (转)在Eclipse中进行C/C++开发的配置方法(20140721最新版)

    因准备考试原因需要在windows下配置C++标准运行环境,找到此文,Mark之. 先列举下自己遇到的情况: 1 JRE安装不上,点了exe文件后没有反应:   安装JDK!!! 2 Eclipse找 ...

  8. eclipse里配置Android ndk环境,用eclipse编译.so文件

    做Android NDK开发时,c代码需要用ndk-build来进行编译,而java代码则需要用Android sdk编译. 编译c代码有两种方法: 一.写好c代码后,然后用cygwin搭建ndk-b ...

  9. Linux环境下Eclipse + Tomcat + MySQL 配置J2EE开发环境的方法

    1. 版本号信息 (1)CentOS 6.4发行版64位,uname -a 显演示样例如以下: Linux localhost.localdomain 3.11.6 #1 SMP Sat Nov 2 ...

随机推荐

  1. 轻量级Spring定时任务(Spring-task)

    Spring3.0以后自主开发的定时任务工具,spring-task,可以将它比作一个轻量级的Quartz,而且使用起来很简单,除spring相关的包外不需要额外的包,而且支持注解和配置文件两种形式. ...

  2. Scratch 少儿编程

    作者:小码王在线少儿编程链接:https://www.zhihu.com/question/23418685/answer/762725469来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非 ...

  3. vue 组件之间互相传值:兄弟组件通信

    vue 组件之间互相传值:兄弟组件通信我们在项目中经常会遇到兄弟组件通信的情况.在大型项目中我们可以通过引入 vuex 轻松管理各组件之间通信问题,但在一些小型的项目中,我们就没有必要去引入 vuex ...

  4. Struts2学习笔记 - namespace命名空间

    默认的命名空间“ namespace="" ”. 根命名空间 “ namespace="/" ”. <package name="test&qu ...

  5. spring 获取url参数

    1. usl格式: http://localhost:8080/contact/delete/3 java代码 @RequestMapping(value="/delete/{id}&quo ...

  6. iSkysoft iMedia Converter Deluxe for Mac的使用方法

    我们电脑上的播放器大多数的播放格式都比较少,所以在播放其它格式的时候容易出错,不能兼容其它的视频格式.今天小编要给大家推荐一种软件,iSkysoft iMedia Converter Deluxe就是 ...

  7. tcpdump使用小记

    1, 类型的关键字主要包括:host, net, port: 2, 确定传输方向的关键字主要包括:src, dst, dst or src, dst and src: 3, 协议的关键字主要包括:fd ...

  8. 【JS】js引擎执行过程

    概述 js引擎执行过程主要分为三个阶段,分别是语法分析,预编译和执行阶段,上篇文章我们介绍了语法分析和预编译阶段,那么我们先做个简单概括,如下: 语法分析: 分别对加载完成的代码块进行语法检验,语法正 ...

  9. UNP学习 多播

    一.概述 单播地址标识单个接口,广播地址标识子网上的所有接口,多播地址标识一组接口. 单播和广播是编址方案的两个极端,多播的目的就在于提供一种折衷的方案. 二.多播地址 我们必须区分IPv4多播地址和 ...

  10. PyCharm 默认快捷键

    1.编辑(Editing) Ctrl + Space    基本的代码完成(类.方法.属性)Ctrl + Alt + Space  快速导入任意类Ctrl + Shift + Enter    语句完 ...