读书人

CKEditor学习札记

发布时间: 2012-07-04 19:33:54 作者: rapoo

CKEditor学习笔记

CKEditor学习笔记:

?

以下出自官方文档API,正宗E文,都是精华啊...

CKEditor 3 JavaScript API Documentation :http://docs.cksource.com/ckeditor_api/

?

CKEditor 3 Developer's Guide : http://docs.cksource.com/CKEditor_3.x/Developers_Guide

?

1:去官网http://ckeditor.com/download下载相应的版本,我今天下的是官网的最新版本ckeditor_3.6.1.zip版,故以下学习笔记是以ckeditor_3.6.1.zip版本为基础,不保证以下学习笔记在其他的ckeditor的版本上是否允许通过<-_->。

2:下载后,解压缩生成文件夹ckeditor,其下目录文件目录众多,这里我简要介绍几个:

\ckeditor\lang\? 文件夹下,是ckeditor的多国语言文件,其中zh-cn.js是中文简体版的

\ckeditor\_samples\? 文件夹下,是ckeditor的官方demo,建议懂E文的Developer看下

\ckeditor\ckeditor.js 文件,是以后使用ckeditor时,必须要引用的文件

?

3:看完例子程序后,写了个html页面,代码如下:

<!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>Sample CKEditor Site</title><script type="text/javascript" src="ckeditor/ckeditor.js"></script><script type="text/javascript" src="ckeditor/config.js"></script><!-- <script type="text/javascript" src="ckeditor/adapters/jquery.js"></script><script type="text/javascript" src="ckeditor/ckeditor_basic.js"></script> --></head><body> <form method="post"><p>My Editor:<br /><textarea cols="80" id="editor_sycdemo" name="editor1" rows="10">                请输入内容......</textarea><script type="text/javascript">//<![CDATA[// This call can be placed at any point after the// <textarea>, or inside a <head><script> in a// window.onload event handler.// Replace the <textarea id="editor"> with an CKEditor// instance, using default configurations.if (CKEDITOR.instances['editor_sycdemo']) {CKEDITOR.instances['editor_sycdemo'].destroy();}//CKEDITOR.replace( 'editor_sycdemo' );//http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.htmlCKEDITOR.replace( 'editor_sycdemo',{    toolbar : 'Full',    //VALUE:Basic ,Full,    uiColor : '#666666',    //VALUE:HTML color name,color code    width:800,    //850,'75%'    //contentsLanguage:'zh-cn',    language:'zh-cn',   // customConfig : 'ckeditor/config.js'    //font_names: //   'Arial/Arial, Helvetica;'+' sans-serif;'+//'Times New Roman/ Times New Roman, Times, serif;'+//'Verdana;'+'宋体;'+'楷体;'+'黑体'//font_names:});//]]></script><p><input type="submit" /></p></body><script type="text/javascript">if ( CKEDITOR.instances.editor_sycdemo.getData() == '' )    alert( 'There is no data available' );</script></html>

?

读书人网 >开源软件

热点推荐