码迷,mamicode.com
首页 > 其他好文 > 详细

CKEditor学习笔记1(CKEditor安装、简单调用)

时间:2014-04-30 22:26:40      阅读:384      评论:0      收藏:0      [点我收藏+]

标签:ckeditor   fckeditor   ckeditor安装   ckeditor调用   ckeditor.js   

安装
1、下载CKEDitor(我下载的是3.6.4) 官网:CKEditor
2、提取ckeditor目录,放入你的Web站点根目录下(WebRoot)

调用CKEditor
调用CKEditor前,先将ckeditor.js引入
<script type="text/javascript" src="ckeditor/ckeditor.js"></script>


方式一:

通过JavaScript调用(我知道有3种方式)
1、创建一个textarea多行文本框,提供一个class="ckeditor"属性
<textarea class="ckeditor"></textarea>
2、创建一个textarea多行文本框,提供一个id或name,再通过CKEDITOR.replace()方法调用
<textarea id="editor1" name="editor1"></textarea>
CKEDITOR.replace( ‘editor1‘,
{
    toolbar : ‘Basic‘,
    uiColor : ‘#9AB8F3‘
});
3、首先创建一个DIV层(填充textarea容器),然后调用CKEDITOR.appendTo()方法
<div id="editorSpace"></div>
<script type="text/javascript">
    CKEDITOR.appendTo("editorSpace");
</script>


方式二:

JSP中通过自定义标签调用(我知道有2种方式,反正大同小异)
1、
步骤一:导入jar包(ckeditor-java-core-3.5.3.jar,官网下载)
步骤二:添加标签库
<%@ taglib prefix="ckeditor" uri="http://ckeditor.com" %>
步骤三:添加一个textarea
<textarea cols="80" id="editor1" name="editor1" rows="10"></textarea>
步骤四:通过replace标签,将普通textarea替代成CKEditor编辑器
<ckeditor:replace replace="editor1" basePath="/ckeditor/" />

2、

步骤一:导入jar包(ckeditor-java-core-3.5.3.jar,官网下载)
步骤二:添加标签库
<%@ taglib prefix="ckeditor" uri="http://ckeditor.com" %>
步骤三:(无须添加textarea)
<ckeditor:editor editor="myEditor" basePath="/CKEditorSample/ckeditor/" value="Type here"></ckeditor:editor>
属性介绍:
basePath:CKEditor目录
editor:textarea name名称
value:textarea默认值

第一篇先这样了,文档参考
里面含有一些Java的基本配置,大家可以参考一下。

CKEditor学习笔记1(CKEditor安装、简单调用)

标签:ckeditor   fckeditor   ckeditor安装   ckeditor调用   ckeditor.js   

原文地址:http://blog.csdn.net/com185272358/article/details/24812489

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!