CKEditor是新一代的FCKditor,是一个重新开发的版本。CKEditor是全球最优秀的网页在线文字编辑器之一,因其惊人的性能与可扩展性而广泛的被运用于各大网站。
目录
一、CKEditor的下载
在CKEditor的官网http://www.ckeditor.com下载CKEditor压缩包,解压之后就可以使用。
我在博客中上传了CKEditor4的资源,如果你不想费事的话可以下载 https://download.csdn.net/download/qq_43238335/12466599
二、CKEditor的创建
将CKEditor工具嵌入网页有很多方法,在此使用的是通过js和jsp完成的。
1.将解压后的ckeditor目录复制到Web工程的WebRoot(myeclipse)或WebContent(eclipse)下。
2.在WebRoot或WebContent下,创建调用页面。
①.导入ckeditor.js文件,<script type="text/javascript" src="../ckeditor/ckeditor.js"></script>
②.创建textarea元素,将其class属性设置为ckeditor
3.创建一个显示页面,获取textarea中的信息
三、CKEditor的配置
CKEditor编辑器可以自由配置,如编辑器的语言、工具集、背景颜色等,CKEditor的配置都集中在ckeditor/config.js文件中。具体的配置属性在官网都可以查阅,没有特殊要求的话是无需配置的。
四、CKEditor调用实例
通过两个jsp文件完成调用和显示。
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript" src="../ckeditor/ckeditor.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>编辑公告</title>
</head>
<body>
<center>
<form method="post" action="a04a_2.jsp">
编辑公告内容
<textarea class="ckeditor" rows="40" cols="80" name="board"></textarea>
<input type="submit" value="显示公告内容" />
</form>
</center>
</body>
</html>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>公告显示</title>
</head>
<body>
<%request.setCharacterEncoding("UTF-8"); %>
${param.board}
</body>
</html>