| 注册
请输入搜索内容

热门搜索

Java Linux MySQL PHP JavaScript Hibernate jQuery Nginx
jopen
10年前发布

在jsp中使用CKEditor

在线编辑器最好的当然是CKEditor.本文介绍CKEditor在jsp环境下的使用。(至少JRE 1.4 and Servlet 2.5/JSP 2.1

下载 http://ckeditor.com/download,推荐下载 ckeditor-java-3.6.4,关键的包是 ckeditor-java-core-3.x.y.jar,x,y表示版本号。目前最新是3.5.3。解压后把ckeditor放入你的工程目录,(当然你可以删除其中像_samples等无实际意义的文件夹);把 ckeditor-core.jar放入工程类加载目录(lib\)。

在Jsp文件导入必要包,

<%@page import="com.ckeditor.CKEditorConfig"%>  <%@page import="com.ckeditor.EventHandler"%>

标签引入,

<%@ taglib uri="http://ckeditor.com" prefix="ckeditor" %>

下面是例子,

<html>   <body>    <form action="getEditor.jsp" method="post">     <p>      <label for="editor1">Editor 1:</label>      <textarea cols="80" id="editor1" name="editor1" rows="10"></textarea>     </p>     <p>      <input type="submit" value="Submit" />     </p>    </form>    <%    CKEditorConfig settings = new CKEditorConfig();  // settings.addConfigValue("toolbar","[[ 'Source', '-', 'Bold', 'Italic' ]]");  %>  <ckeditor:replace replace="editor1" basePath="ckeditor/" />   </body>   </html>

核心是利用ckeditor标签replace一个textarea。你也可以进行各种定制,比如定义编辑器样式、工具栏等。

 

以下介绍如何将CKEditor和CKFinder组合使用,因为如果不这样,编辑器上传图片等功能是无法使用的。CKFinder的单独配置这里不介绍,相关可以查看笔者以前的博客。

组合的方法可以采取taglib的方式,也可以采用Js的方式。

Taglib: 

<%@ taglib uri="http://cksource.com/ckfinder" prefix="ckfinder" %>
然后使用:<ckfinder:setupCKEditor basePath="ckfinder/" editor="editor1" />

Js:

var editor = CKEDITOR.replace( 'editor1' );  CKFinder.setupCKEditor( editor, '/ckfinder/' );

当然上述两种方式都可以进一步自定义设置。效果图如下:

20130926004203234.png

来自:http://blog.csdn.net/chenloveit/article/details/12032431

 本文由用户 jopen 自行上传分享,仅供网友学习交流。所有权归原作者,若您的权利被侵害,请联系管理员。
 转载本站原创文章,请注明出处,并保留原始链接、图片水印。
 本站是一个以用户分享为主的开源技术平台,欢迎各类分享!
 本文地址:https://www.open-open.com/lib/view/open1406258519742.html
CKEditor HTML编辑器