FCKEDITOR

转载 2016年06月01日 11:24:54
FCKeditor是目前最优秀的可见即可得网页编辑器之一,它采用JavaScript编写。具备功能强大、配置容易、跨浏览器、支持多种编程语言、开源等特点。它非常流行,互联网上很容易找到相关技术文档,国内许多WEB项目和大型网站均采用了FCKeditor。
FCKeditor是一个专门使用在网页上属于开放源代码的所见即所得文字编辑器。它志于轻量化,不需要太复杂的安装步骤即可使用。它可和PHP、JavaScript、ASP、ASP.NET、ColdFusion、Java、以及ABAP等不同的编程语言相结合。“FCKeditor”名称中的“FCK” 是这个编辑器的作者的名字Frederico Caldeira Knabben的缩写。
FCKeditor 相容于绝大部分的网页浏览器,像是 : Internet Explorer 5.5+(Windows)、Mozilla Firefox 1.0+、Mozilla 1.3+ 和Netscape 7+。在未来的版本也将会加入对 Opera的支持。
FckEditor更名CKEditor
著名的开源网页编辑软件FCKEditor在09年发布更新到3.0,并改名为CKEditor。原来叫FCK,是因为最初的开发者叫Frederico Calderia Knabben;现在叫CK,意指"Content and Knowledge"。新版的编辑器的更新包括:新的用户界面,一个支持Plug-in的Javascript API,并提供对视觉障碍者的使用支持。"
据官方的解释,CK是对FCK的代码的完全重写,而且此项工作从2007年就开始了,并在今年初发表了多个测试版。至此,为大家服务长达6年的FCKeditor将被CKeditor替代。
中文名
网页编辑器
外文名
FCKeditor
兼容性
相容于绝大部分的网页浏览器
更    名
CKEditor
属    性
网页编辑器

中文解释

编辑
AutoDetectLanguage=true/false 自动检测语言
BaseHref="" 相对链接的基地址
ContentLangDirection="ltr/rtl" 默认文字方向
ContextMenu=字符串数组,右键菜单的内容
CustomConfigurationsPath="" 自定义配置文件路径和名称
Debug=true/false 是否开启调试功能,这样,当调用FCKDebug.Output()时,会在调试窗中输出内容
DefaultLanguage="" 缺省语言
EditorAreaCss="" 编辑区的样式表文件
EnableSourceXHTML=true/false 为TRUE时,当由可视化界面切换到代码页时,把HTML处理成XHTML
EnableXHTML=true/false 是否允许使用XHTML取代HTML
FillEmptyBlocks=true/false 使用这个功能,可以将空的块级元素用空格来替代
FontColors="" 设置显示颜色拾取器时文字颜色列表
FontFormats="" 设置显示在文字格式列表中的命名
FontNames="" 字体列表中的字体名
FontSizes="" 字体大小中的字号列表
ForcePasteAsPlainText=true/false 强制粘贴为纯文本
ForceSimpleAmpersand=true/false 是否不把&符号转换为XML实体
FormatIndentator="" 当在源码格式下缩进代码使用的字符
FormatOutput=true/false 当输出内容时是否自动格式化代码
FormatSource=true/false 在切换到代码视图时是否自动格式化代码
FullPage=true/false 是否允许编辑整个HTML文件,还是仅允许编辑BODY间的内容
GeckoUseSPAN=true/false 是否允许SPAN标记代替B,I,U标记
IeSpellDownloadUrl=""下载拼写检查器的网址
ImageBrowser=true/false 是否允许浏览服务器功能
ImageBrowserURL="" 浏览服务器时运行的URL
ImageBrowserWindowHeight="" 图像浏览器窗口高度
ImageBrowserWindowWidth="" 图像浏览器窗口宽度
LinkBrowser=true/false 是否允许在插入链接时浏览服务器
LinkBrowserURL="" 插入链接时浏览服务器的URL
LinkBrowserWindowHeight=""链接目标浏览器窗口高度
LinkBrowserWindowWidth=""链接目标浏览器窗口宽度
Plugins=object 注册插件
PluginsPath="" 插件文件夹
ShowBorders=true/false 合并边框
SkinPath="" 皮肤文件夹位置
SmileyColumns=12 图符窗列数
SmileyImages=字符数组 图符窗中图片文件名数组
SmileyPath="" 图符文件夹路径
SmileyWindowHeight 图符窗口高度
SmileyWindowWidth 图符窗口宽度
SpellChecker="ieSpell/Spellerpages" 设置拼写检查器
StartupFocus=true/false 开启时FOCUS到编辑器
StylesXmlPath="" 设置定义CSS样式列表的XML文件的位置
TabSpaces=4 TAB键产生的空格字符数
ToolBarCanCollapse=true/false 是否允许展开/折叠工具栏
ToolbarSets=object 允许使用TOOLBAR集合
ToolbarStartExpanded=true/false 开启时TOOLBAR是否展开
UseBROnCarriageReturn=true/false 当回车时是产生BR标记还是P或者DIV标记

调用种类

编辑
在ASP dot NET中调用
在ASP dot NET中调用其实是很简单的事,FCKEditor有一个FCKeditor dot Net (一个ASP dot NET 服务器控件),可以很容易地与ASP dot NET集成。
首先去FCKEditor官网下载FCKEditor和FCKeditor dot Net服务器控件。
按以下步骤在ASP dot NET页面是调用:
1、为ASP dot NET应用程序添加FCKeditor dot Control的引用。
方法一、解压FCKeditor dot Net,在Visual Sutdio的工具箱中右击→添加项目,在打开的对话框中点击“浏览”按钮,定位到解压后的FCKeditor dot Net控件的\bin\Release\2.0\下的FredCK.FCKeditorV2.dll文件,点击确定。此时,Visual Studio的工具箱中就会出现FCKEditor,就要以像其他控件一样使用了。
方法二、把\bin\Release\2.0\下的FredCK.FCKeditorV2.dll文件复制到ASP dot NET应用程序的Bin文件夹下,然后在要调用FCKEditor的.aspx页面中添加一条注册指令<%@ Register Assembly="FredCK.FCKeditorV2" Namespace="FredCK.FCKeditorV2" TagPrefix="FCKeditorV2" %>就可以使用了。
<FCKeditorV2:FCKeditor ID="FCKeditor1" runat="server">
</FCKeditorV2:FCKeditor>
但是,如果就这样访问页面的话,FCKEditor所在的区域将会出现404(File Not Found)的错误。这是因为还没有FCKEditor所要使用的资源文件。请看下一步:
2、指定资源文件的位置
把下载到的FCKEditor解压到你的ASP dot NET应用程序下的任意位置,如应用程序根目录下的fckeditor。然后修改页面中控件的声明为:
<FCKeditorV2:FCKeditor ID="FCKeditor1" runat="server" BasePath="~/fckeditor/">
</FCKeditorV2:FCKeditor>
这里的BasePath用来指定FCKEditor资源文件(其中包含有JavaScript脚本、用于显示FCKEditor工具栏的PNG图片等)的位置,其值取决于你把FCKEditor解压的位置。
以上步骤完成后,你将在.aspx页面中看到FCKEditor的庐山真面目。
在PHP中调用
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
<?php
functionFCKeditor_IsCompatibleBrowser()
{
if(isset($_SERVER)){
$sAgent=$_SERVER['HTTP_USER_AGENT'];
}
else{
global$HTTP_SERVER_VARS;
if(isset($HTTP_SERVER_VARS)){
$sAgent=$HTTP_SERVER_VARS['HTTP_USER_AGENT'];
}
else{
global$HTTP_USER_AGENT;
$sAgent=$HTTP_USER_AGENT;
}
}
if(strpos($sAgent,'MSIE')!==false&&strpos($sAgent,'mac')===false&&strpos($sAgent,'Opera')===false)
{
$iVersion=(float)substr($sAgent,strpos($sAgent,'MSIE')+5,3);
return($iVersion>=5.5);
}
elseif(strpos($sAgent,'Gecko/')!==false)
{
$iVersion=(int)substr($sAgent,strpos($sAgent,'Gecko/')+6,8);
return($iVersion>=20030210);
}
elseif(strpos($sAgent,'Opera/')!==false)
{
$fVersion=(float)substr($sAgent,strpos($sAgent,'Opera/')+6,4);
return($fVersion>=9.5);
}
elseif(preg_match("|AppleWebKit/(\d+)|i",$sAgent,$matches))
{
$iVersion=$matches[1];
return($matches[1]>=522);
}
else
returnfalse;
}
classFCKeditor
{
public$InstanceName;
public$BasePath;
public$Width;
public$Height;
public$ToolbarSet;
public$Value;
public$Config;
publicfunction__construct($instanceName)
{
$this->InstanceName=$instanceName;
$this->BasePath='../common/editor/';
$this->Width='100%';
$this->Height='400';
$this->ToolbarSet='Default';
$this->Value='';
$this->Config=array();
}
publicfunctionCreate()
{
echo$this->CreateHtml();
}
publicfunctionCreateHtml()
{
$HtmlValue=htmlspecialchars($this->Value);
$Html='';
if($this->IsCompatible())
{
if(isset($_GET['fcksource'])&&$_GET['fcksource']=="true")
$File='fckeditor.original.html';
else
$File='fckeditor.html';
$Link="{$this->BasePath}editor/{$File}?InstanceName={$this->InstanceName}";
if($this->ToolbarSet!='')
$Link.="&amp;Toolbar={$this->ToolbarSet}";
$Html.="<inputtype=\"hidden\"id=\"{$this->InstanceName}\"name=\"{$this->InstanceName}\"value=\"{$HtmlValue}\"style=\"display:none\"/>";
$Html.="<inputtype=\"hidden\"id=\"{$this->InstanceName}___Config\"value=\"".$this->GetConfigFieldString()."\"style=\"display:none\"/>";
$Html.="<iframeid=\"{$this->InstanceName}___Frame\"src=\"{$Link}\"width=\"{$this->Width}\"height=\"{$this->Height}\"frameborder=\"0\"scrolling=\"no\"></iframe>";
}
else
{
if(strpos($this->Width,'%')===false)
$WidthCSS=$this->Width.'px';
else
$WidthCSS=$this->Width;
if(strpos($this->Height,'%')===false)
$HeightCSS=$this->Height.'px';
else
$HeightCSS=$this->Height;
$Html.="<textareaname=\"{$this->InstanceName}\"rows=\"4\"cols=\"40\"style=\"width:{$WidthCSS};height:{$HeightCSS}\">{$HtmlValue}</textarea>";
}
return$Html;
}
publicfunctionIsCompatible()
{
returnFCKeditor_IsCompatibleBrowser();
}
publicfunctionGetConfigFieldString()
{
$sParams='';
$bFirst=true;
foreach($this->Configas$sKey=>$sValue)
{
if($bFirst==false)
$sParams.='&amp;';
else
$bFirst=false;
if($sValue===true)
$sParams.=$this->EncodeConfig($sKey).'=true';
elseif($sValue===false)
$sParams.=$this->EncodeConfig($sKey).'=false';
else
$sParams.=$this->EncodeConfig($sKey).'='.$this->EncodeConfig($sValue);
}
return$sParams;
}
publicfunctionEncodeConfig($valueToEncode)
{
$chars=array(
'&'=>'%26',
'='=>'%3D',
'"'=>'%22');
returnstrtr($valueToEncode,$chars);
}
}
$editor=newFCKeditor('editor');//接收时$_POST['........']中的内容
$editor->BasePath="../common/editor/";//FCKEDITOR的路径
?>
在需要调用的地方<?php $editor->Create();?>
接受的文件用$_POST['editor']调用(editor)可在$editor = new FCKeditor('editor')设置
在Asp中调用
首先在文件顶部包含主文件
<!--#include file="../fckeditor.asp"-->
在适当的地方插入文本区域内容:
1
2
3
4
5
6
7
8
9
<%
DimoFCKeditor
SetoFCKeditor=NewFCKeditor
oFCKeditor.ToolbarSet="A"’使用工具条
oFCKeditor.Width="100%"’宽度
oFCKeditor.Height="400"’高度
oFCKeditor.Value=’源文件
oFCKeditor.Create"content"’文本框名称
%>
在JSP中调用
web.xml配置:
FckEditor for java 2.4版本
1
2
3
4
5
6
7
8
9
10
11
12
13
<servlet>
<servlet-name>Connector</servlet-name>
<servlet-class>
net.fckeditor.connector.ConnectorServlet
</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>Connector</servlet-name>
<url-pattern>
/fckeditor/editor/filemanager/connectors/*
</url-pattern>
</servlet-mapping>
在JSP中使用标签调用demo:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<%@pagelanguage="java"import="java.util.*"pageEncoding="UTF-8"%>
<%@tagliburi="http://java.fckeditor.net"prefix="FCK"%>
<html>
<head>
<title>FckEditor测试</title>
</head>
<bodystyle="text-align:center;">
FckEditor测试
<hr>
<formaction="ShowData.jsp"method="post">
<FCK:editorinstanceName="test"height="400pt">
<jsp:attributename="value">这里是http://baike.baidu.com/">数据测试
</jsp:attribute>
</FCK:editor>
<inputtype="submit"value="提交"/>
<inputtype="reset"value="重置"/>
</form>
</body>
</html>

工具条

编辑
/* Source="页面源码"
DocProps="页面属性"
Save="保存"
NewPage="新建"
Preview="预览"
Templates="模版"
Cut="剪切"
Copy="拷贝"
Paste="粘贴"
PasteText="粘贴为无格式的文本"
PasteWord="粘贴Word格式"
Print="打印"
SpellCheck="拼写检查,要装插件"
Undo="撤消"
Redo="重做"
Find="查找"
Replace="替换"
SelectAll="全选"
RemoveFormat="清除格式(清除现在文本的格式)"
Form="表单域"
Checkbox="复选"
Radio="单选"
TextField="单行文本"
Textarea="多行文本"
Select="列表"
Button="按钮"
ImageButton="图像区域"
HiddenField="隐藏域"
Bold="加粗"
Italic="倾斜"
Underline="下划线"
StrikeThrough="删除线"
Subscript="下标"
Superscript="上标"
OrderedList="删除/插入项目列表"
UnorderedList="删除/插入项目符号"
Outdent="减少缩进"
Indent="增加缩进"
JustifyLeft="左对齐"
JustifyCenter="居中对齐"
JustifyRight="右对齐"
JustifyFull="分散对齐"
Link="链接"
Unlink="删除链接"
Anchor="插入/删除锚点"
Image="上传图片"
Flash="上传动画"
Table="插入表格"
Rule="插入水平线"
Smiley="插入表情"
SpecialChar="插入特殊字符"
PageBreak="插入分页符"
Style="样式"
FontFormat="格式"
FontName="字体"
FontSize="大小"
TextColor="字体颜色"
BGColor="背景色"
FitWindow="全屏编辑"
About="关于我们"
*/
也就是fckeditor总配置文件,位于根目录下的fckconfig.js文件。请根据下面的列表进行(以fckeditor 2.0版的为准):找到第20行 FCKConfig.DefaultLanguage = 'en' ;改为 FCKConfig.DefaultLanguage = 'zh-cn' ;设置默认语言为简体中文
找到第40行 FCKConfig.TabSpaces = 0 ; 改为FCKConfig.TabSpaces = 1 ; 即在编辑器域内可以使用Tab键。
如果你的编辑器还用在网站前台的话,比如说用于留言本或是日记回复时,那就不得不考虑安全了,在前台千万不要使用Default的toolbar,要么自定义一下功能,要么就用系统已经定义好的Basic,也就是基本的toolbar,
找到第64行:
FCKConfig.ToolbarSets["Basic"] = [
['Bold','Italic','-','OrderedList','UnorderedList','-',/*'Link',*/'Unlink','-','Style','FontSize','TextColor','BGColor','-','Smiley','SpecialChar','Replace','Preview']
] ;
这是我改过的Basic,把图像功能去掉,把添加链接功能去掉,因为图像和链接和flash和图像按钮添加功能都能让前台页直接访问和上传文件,要是这儿不改直接给你上传个木马还不马上玩完?
以下为全部显示工具栏显示的示例:
FCKConfig.ToolbarSets["Default"] = [//Default工具条的名称
[’Source’,’DocProps’,’-’,’Save’,’NewPage’,’Preview’,’-’,’Templates’],
[’Cut’,’Copy’,’Paste’,’PasteText’,’PasteWord’,’-’,’Print’,’SpellCheck’],
[’Undo’,’Redo’,’-’,’Find’,’Replace’,’-’,’SelectAll’,’RemoveFormat’],
[’Form’,’Checkbox’,’Radio’,’TextField’,’Textarea’,’Select’,’Button’,’ImageButton’,’HiddenField’],
’/’,
[’Bold’,’Italic’,’Underline’,’StrikeThrough’,’-’,’Subscript’,’Superscript’],
[’OrderedList’,’UnorderedList’,’-’,’Outdent’,’Indent’],
[’JustifyLeft’,’JustifyCenter’,’JustifyRight’,’JustifyFull’],
[’Link’,’Unlink’,’Anchor’],
[’Image’,’Flash’,’Table’,’Rule’,’Smiley’,’SpecialChar’,’PageBreak’],
’/’,
[’Style’,’FontFormat’,’FontName’,’FontSize’],
[’TextColor’,’BGColor’],
[’FitWindow’,’-’,’About’]
] ;
用户根据需要自行配置
//去除超链接选显卡 上传
// config.removeDialogTabs = "link:upload;image:Upload";
//去除超链接选显卡 目标
//config.removeDialogTabs = "image:advanced;link:target;"
//去除超链接选显卡 目标 高级 上传 去除flash目标上传
config.removeDialogTabs = "link:advanced;link:target;image:advanced;image:target;link:upload;image:Upload;flash:advanced;image:Link;flash:upload;flash:Upload";

最新版本

编辑
目前FCKeditor已发展到3.0,并更名为CKEditor,最新版本是CKEditor 4.4.5。
CKEditor是FCKeditor的一个完全重写版本,加载更快更方便使用。
FCKeditor最后版本为2.6.6
fckeditor for java最新版本为2.4
相对于2.3有如下改变:
◆The integration pack is now managed by Maven 2 with complete documentation and reports.
◆Automatic creation of release distribution files (assemblies).
◆The library runs now from Servlet 2.4/JSP 2.0 and above.
◆A complete structure and package review has been done. Base package moved from com.fredck.FCKeditor to net.fckeditor.
◆The Server Side Integration requirements are completely fulfilled.
◆The SimpleUploaderServlet functionality has been merged into the ConnectorServlet.
◆The JSP tag library has been completely restructured.
◆A more complete and reliable browser detection code.
◆New configuration handling:
★No configuration settings in the web.xml anymore.
★The configuration properties can be set in a common properties file or programmatically.
★'Convention over conversion', just reset the properties which don't meet your requirements.
◆Introduced the state-of-the-art SLF4J logging facade.
◆Pluggable interfaces have been introduced to extend the ConnectorServlet. This system provides session or request-based functionality.
◆JUnit test coverage on viable classes.
◆Clean and safe parameter handling and abstraction.
◆A lot of code performance improvements and tweaks.
2012年11月28日,CKEditor 4 正式版发布,全新外观
CKEditor 团队很高兴的宣布了 CKEditor 4 正式版发布!该版本带来全新的外观、提升代码、即时编辑和其他诸多改进。同时还发布了一个新网站包含扩展中心和名为 CKBuilder 的服务,可用于创建自己的 CKEditor 版本。

相关文章推荐

fckeditor编辑器的使用

FCKeditor是一个专门使用在网页上属于开放源代码的所见即所得文字编辑器。它志于轻量化,不需要太复杂的安装步骤即可使用。它可和PHP、JavaScript、ASP、ASP.NET、ColdFusi...

struts2和fckeditor的整合

在struts2中,默认的action和serverlt一样是没有后缀(.action)的,因此这个时候访问一个地址,很可能是一个serlet,也可能是action。而本文要用的fckeditor在上...

JSP使用FCKeditor控件

2010-11-12JSP使用FCKeditor控件文章分类:Java编程  FCKeditor是一个专门使用在网页上属于开放源代码的所见即所得文字编辑器。它志于轻量化,不需要太复杂的安装步骤即可使用...

在MyEclipse6.5中配置fckeditor

开发环境:IDE:MyEclipse6.5框架:Struts2+spring+hibernate步骤:1. 在fckeditor的官方网站http://ckeditor.com/download下载F...

VS2008下使用FCKeditor2.6.3安装配置详细图解(asp.net)

VS2008下使用FCKeditor2.6.3安装配置详解 FCKeditor官方网址 http://www.fckeditor.net/ http://ckeditor.com/ http:...

Fckeditor <= 2.4.2 的任意文件上传漏洞代码解析

无聊,看了下fckeditor的漏洞,发现有网友已经提出Fckeditor 首先打开fckeditor\editor\filemanager\upload\php\config.php  配置fc...

对FckEditor的配置和操作

CKEditor 集成 在网站中引用CKFinder.dll 配置参考文档,主要将ckeditor中的(adapters、images、lang、plugins、skins、themes、cked...

FCKEditor 使用

看大家要FCKeditor上传设置的部分,所以仔细找了下,以前看到别人说FCKeditor有上传漏洞,所以一直没有用过此功能!希望能够解决大家的问题! 因版本更新问题,可能具体行数不一致,请大家仔细...
  • yl_99
  • yl_99
  • 2012-04-05 22:56
  • 630

Java FckEditor 2.6+JSP的配置方法详解

转自:http://www.sunchis.com/html/java/javaweb/2011/0318/270.html 按照这个文章做得,很好用。 关于FckEditor for...

FCKeditor 及 xhEditor 使用详解——HTML可视化编辑器

One、介绍下两种HTML编辑器: FCKeditor是CKEditor的前身,后者比前者功能更强大,更简介,更好用。我另外的帖子中有写到CKEditor的具体使用配置方法,有兴趣的童鞋们可...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)