用什么样的Web编辑器，eWebEditor，kindeditor还是FCKEditor

我接触的第一个Web编辑器是eWebEditor。它是国产的，在IE7及以下的版本中效果是非常不错的，不兼容IE8及火狐，而且使用不当就会留下上传漏洞的隐患。这样的编辑器，还是不要用了（很想支持国产，但是）

放弃eWebEditor后，我选择了kindeditor。它是老外开发的，能兼容目前所有版本的浏览器，纯静态（文件上传需要自

己实现，小问题）。但是它不支持Word表格的复制（就是不能直接从Word上复制表格到编辑器中），而且会经常出现图文丢失的现象，郁闷，我还是不用了（老外的东西也不一定好，）

前段时间接触了FCKEditor，发现这个编辑器相当不错，查了一下，网上大家对它的评价超高（貌似淘宝也是用的这个编

辑器）。它也是老外开发的，能兼容目前所有版本的浏览器，对Word的支持非常好，复制表格没有一点变形。到目前为

止，我已经在两个项目中使用了这个编辑器，一个是基于PHP的订餐系统，另外一个是基于ASP的公司网站，FCKEditor对PHP，ASP以及ASPNET的支持都很好，使用起来非常方便。

编辑器的安全问题一直是一个令很多人头痛的问题，这主要在于文件上传上。各种编辑器默认情况下都没有对文件上传

进行身份认证（它也不可能实现一个通用的身份认证），开发者必须根据自己系统的情况加入适当的身份认证代码。另外

编辑器允许的文件上传类型也需要进行严格的限制，例如eWebEditor允许在后台修改上传文件类型，这样一旦歹徒获取后

台密码，即可轻易上传任意格式的文件。低版本的FCKEditor（好像是21以下的版本）默认情况下允许上传任意格式的文件。

总结一下FCKEditor的使用（以265版为例）：

（1）精简，"言多必失"，文件多了也是一种隐患。FCKEditor支持多种服务器脚本语言，实际使用的时候我们根本用不了那么多文件，我们要根据自己的需要对其进行精简。

对于ASP系统来说：

FCKEditor根目录，仅保留"fckeditorasp，fckconfigjs，fckeditorjs，fckpackagerxml，fckstylesxml，

fcktemplatesxml"这些文件以及editor目录。删除示例目录"_samples"。

"fckeditor\editor\filemanager\connectors"目录下面仅保留"asp"目录，删除其它目录和文件。

对于PHP系统来说：

FCKEditor根目录，仅保留"fckeditorphp，fckeditor_php4php，fckeditor_php5php，fckconfigjs，fckeditorjs，

fckpackagerxml，fckstylesxml，fcktemplatesxml"这些文件以及editor目录。删除示例目录"_samples"。"fckeditor\editor\filemanager\connectors"目录下面仅保留"php"目录，删除其它目录和文件。

（2）修改文件上传采用的脚本程序（语言）。

默认的FCKEditor文件上传程序为asp，如果是用在asp系统中，那就不用再修改了。

如果是用在PHP系统中的话，需要做如下修改，打开fckconfigjs

找到:

var _FileBrowserLang ge = asp

var _QuickUploadLang ge = asp

改成:

var _FileBrowserLang ge = php

var _QuickUploadLang ge = php

（3）开启文件上传，修改文件上传目录。

对于ASP系统来说：

打开fckeditor\editor\filemanager\connectors\asp\configasp

启用文件上传:

找到:

ConfigIsEnabled = false

改成:

ConfigIsEnabled = tr

设置上传存放目录:

找到:

ConfigUserFilesPath = "/admin/uppic/"

改成:

ConfigUserFilesPath = "自定义的路径"

对于PHP系统来说：

打开fckeditor/editor/filemanager/browser/default/connectors/php/configphp

启用文件上传:

找到:

$Config[Enabled] = false

改成:

$Config[Enabled] = tr

设置上传存放目录:

找到:

$Config[UserFilesPath] = /userfiles/

改成:

$Config[UserFilesPath] = 自定义的路径

（4）修改上传文件命名方式。

FCKEditor上传文件，文件名采用原文件名，如果想采用自定义的文件命名方式（比如，随即名称），可以修改如下地

方：

对于ASP系统来说：

打开fckeditor\sample\edit\editor\filemanager\connectors\asp\commandsasp

找到：

sFileName = SanitizeFileName( sFileName )

将该句改为自定义的文件命名格式，例如：

dim RndStr

Randomize

RndStr = Cstr(Fix(9000rnd()+1000)) 产生一个随机数

sFileName =year(date)&month(Date)&day(Date)&hour(time)&minute(time)&second(time)&RndStr &"" &

tension

对于PHP系统来说：

打开fckeditor\editor\editor\filemanager\connectors\php\commandsphp

找到：

$sOriginalFileName = $sFileName ;

在该句前面加入：

// 初始化种子

$sstr =split(" ",microtime(),5);

$seed =$sstr[0]10000;

// 使用种子初始化随机数发生器

srand($seed);

// 生成指定范围内的随机数

$random =rand(1000,10000);

// 合成随即的文件名

$sFileName = date("YmdHis", time())$random""$tension;

（5）FCKEditor在程序中引用方式。

对于ASP系统来说：

需要包含下面的头文件

<!--#incl file="fckeditor/fckeditorasp"-->

在编辑器所在的位置添加如下代码：

<%

Dim oFCKeditor

Set oFCKeditor = New FCKeditor

oFCKeditorBasePath = "/fckeditor/" 这个路径必须是相对于站点根目录的路径，设置错误编辑器

将无法显示

oFCKeditorToolbarSet="Default"

oFCKeditorWidth = "98%"

oFCKeditorHeight= "500px"

oFCKeditorVal = "" 设置默认值

oFCKeditorCreate "shangpin_description" 编辑器的id，相当于input标签的name属性值，这里是

shangpin_description

%>

对于PHP来说：

在编辑器所在的位置添加如下代码：

<php

incl("fckeditor/fckeditorphp"); // 头文件

$oFCKeditor = new FCKeditor("shangpin_description") ; // 编辑器的id，相当于input标签的

name属性值，这里是shangpin_description

$oFCKeditor->BasePath="/fckeditor/ " ; //设置FCKeditor路径

$oFCKeditor->ToolbarSet ="Default";

$oFCKeditor->Width="98%";

$oFCKeditor->Height="500px";

$oFCKeditor->Val=""; // 设置默认值

$oFCKeditor->Create();

>

（6）获取FCKEditor中的数据。

对于服务器端脚本程序来说，将"编辑器的id"当做input标签的name属性值来获取即可，例如：

在ASP中reqst("shangpin_description")，在PHP中$_REQST["shangpin_description"]

JS中用FCKeditorAPIGetInstance(shangpin_description)GetXHTML(tr)得到shangpin_description对应的值

获取编辑器中HTML内容

function getEditorHTMLContents(EditorName)

{

var oEditor = FCKeditorAPIGetInstance(EditorName);

return(oEditorGetXHTML(true));

}

获取编辑器中文字内容

function getEditorTextContents(EditorName)

{

var oEditor = FCKeditorAPIGetInstance(EditorName);

return(oEditorEditorDocumentbodyinnerText);

}

设置编辑器中内容

function SetEditorContents(EditorName, ContentStr)

{

var oEditor = FCKeditorAPIGetInstance(EditorName) ;

oEditorSetHTML(ContentStr) ;

}

没看明白你的代码要做什么，我把如何获取当前网站网址的方法写给你

var weburl = windowlocationhrefmatch(/^>

去除word格式指从word粘贴这个功能吧？

这个功能的函数是：

function _clearMsWord(html, htmlTags) {

html = htmlreplace(/<meta[\s\S]>/ig, '')

replace(/<![\s\S]>/ig, '')

replace(/<style[^>]>[\s\S]<\/style>/ig, '')

replace(/<script[^>]>[\s\S]<\/script>/ig, '')

replace(/<w:[^>]+>[\s\S]<\/w:[^>]+>/ig, '')

replace(/<o:[^>]+>[\s\S]<\/o:[^>]+>/ig, '')

replace(/<xml>[\s\S]<\/xml>/ig, '')

replace(/<(:table|td)[^>]>/ig, function(full) {

return fullreplace(/border-bottom:([#\w\s]+)/ig, 'border:$1');

});

return _formatHtml(html, htmlTags);

}

htmlTags = {

font : ['color', 'size', 'face', 'background-color'],

span : [

'color', 'background-color', 'font-size', 'font-family', 'background',

'font-weight', 'font-style', 'text-decoration', 'vertical-align', 'line-height'

],

div : [

'align', 'border', 'margin', 'padding', 'text-align', 'color',

'background-color', 'font-size', 'font-family', 'font-weight', 'background',

'font-style', 'text-decoration', 'vertical-align', 'margin-left'

],

table: [

'border', 'cellspacing', 'cellpadding', 'width', 'height', 'align', 'bordercolor',

'padding', 'margin', 'border', 'bgcolor', 'text-align', 'color', 'background-color',

'font-size', 'font-family', 'font-weight', 'font-style', 'text-decoration', 'background',

'width', 'height', 'border-collapse'

],

'td,th': [

'align', 'valign', 'width', 'height', 'colspan', 'rowspan', 'bgcolor',

'text-align', 'color', 'background-color', 'font-size', 'font-family', 'font-weight',

'font-style', 'text-decoration', 'vertical-align', 'background', 'border'

],

a : ['href', 'target', 'name'],

embed : ['src', 'width', 'height', 'type', 'loop', 'autostart', 'quality', 'width', 'height', 'align', 'allowscriptaccess'],

img : ['src', 'width', 'height', 'border', 'alt', 'title', 'align', 'width', 'height', 'border'],

'p,ol,ul,li,blockquote,h1,h2,h3,h4,h5,h6' : [

'align', 'text-align', 'color', 'background-color', 'font-size', 'font-family', 'background',

'font-weight', 'font-style', 'text-decoration', 'vertical-align', 'text-indent', 'margin-left'

],

pre : ['class'],

hr : ['class', 'page-break-after'],

'br,tbody,tr,strong,b,sub,sup,em,i,u,strike,s,del' : []

};

fck里面可以配置按钮的显示的，你自己弄个图标放上去然后加这个js就行了。

首先要实现输入内容不同颜色是可以实现的，比如使用一个可编辑iframe就可以了，textarea是不行的。

至于功能的实现，我觉得不需要获取结束位置。

首先检测鼠标事件，如果有点击编辑区的某个位置，你就获取当前鼠标的落点，然后用innerHTML加入一对标签，<span class="color:#XXXXXX"></span>，所有输入内容都在这个span中间。效果就是输入的所有文字都变色。

不知道楼主明白没？

以上就是关于用什么样的Web编辑器，eWebEditor，kindeditor还是FCKEditor全部的内容，包括:用什么样的Web编辑器，eWebEditor，kindeditor还是FCKEditor、js如何给fck赋值啊、关于js正则表达式问题-某长字符串的Url中去除包含本地域名的字符串等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！