FCKeditor 配置使用 JS获取FCKeditor内容

时间:2021-07-30 07:46:41

二.FCKeditor

★FCKeditor的配置使用及JS获取FCKeditor内容

一、FCKeditor的配置使用

拷贝fckeditor文件到webroot目录下,右击文件根目录--MyEclipse--Exculde From Validation--不进行有效性验证

1._samples文件夹为例子

2.页面添加如下代码

   <script src="/guestbook/fckeditor/fckeditor.js"></script>   //设置js文件路径
      
       <script>
       var editor=new FCKeditor('name');      //实例化--设置文本域名字
       editor.BasePath='/guestbook/fckeditor/';     //fck根目录
       editor.Height=200;        //设置编辑器高度
       editor.ToolbarSet='Default'; Basic:精简版 / Default:完整版 //工具栏设置
       editor.Create();        //创建
       </script>

自定样式:fckconfig.js
     ['Bold','Italic','Underline','-','JustifyLeft','JustifyCenter','JustifyRight','OrderedList','UnorderedList','-','Undo','Redo','-','Link','Unlink','-','Smiley','TextColor','BGColor','Rule'],
       ['Style','FontFormat','FontName','FontSize']
3.接受值:request.getParameter("name"))

4.瘦身:
一级目录:   保留文件--fckconfig.js,fckeditor.js,fckstyles.xml
二级目录editor: 删_source plugins
三级editor.lang目录: 保留zh.js zh-cn.js en.js
      editor.skins目录: 删office2003,silver文件

二、更换皮肤

如果想更换皮肤:
将皮肤文件夹中的文件考入skins包:
并更改配置:
找到此行:FCKConfig.SkinPath = FCKConfig.BasePath + 'skins/default/' ;
用office2003:就将default改成office2003
还有silver等皮肤

三、图片上传路径:

PHP:

1.打开 \Public\Js\FCKeditor\editor\filemanager\connectors\语言种类\config.php文件,修改

$Config['UserFilesPath'] = '/你的项目名称/存放图片的文件夹' ;
// 如 $Config['UserFilesPath'] = '/xlmxbgCMS2TP2.0/Public/userFiles/' ;

2.在 \xlmxbgCMS2TP2.0\Public\ 目录下新建文件夹 userFiles (对应上面的例子,最好手动创建一下文件夹)

其他语言的图片、flash登上传功能暂不介绍。


四、JS获取fckeditor中内容:

// 获取编辑器中HTML内容
function getEditorHTMLContents(EditorName) {
    var oEditor = FCKeditorAPI.GetInstance(EditorName);
    return(oEditor.GetXHTML(true));
}

// 获取编辑器中文字内容
function getEditorTextContents(EditorName) {
    var oEditor = FCKeditorAPI.GetInstance(EditorName);
    return(oEditor.EditorDocument.body.innerText);
}

// 配置编辑器中内容
function SetEditorContents(EditorName, ContentStr) {
    var oEditor = FCKeditorAPI.GetInstance(EditorName) ;
    oEditor.SetHTML(ContentStr) ;
}

五、显示数据问题:
1.存储数据时会自动在数据后添加“,”号。
原因:在页面中有相同名的表单元素。
2.用编辑器存储的数据的特殊字符都转换为html代码,

解决:所以显示用编辑器存储的数据时:先添加一个隐藏的层,
<span id="contents" style="display:none">&lt;p&gt;This is right content!!!&lt;/p&gt;</span>
然后在fckeditor的配置中添加:editor.Value=contents.innerText;

这样,以上问题都解决了。