今天主要介绍关于运用Js获取、刺进和更改FCKeditor编辑器里的内容,包含JS操作Fckeditor的一些常用方法,需要的朋友可以学习学习
之前在一个系统里运用了FCKeditor编辑器,因为项目需求需要在FCKeditor里增加一个自定义的按钮用于完成自己的需求
主要是在点击该按钮时删去或增加FCKeditor编辑器里的内容
其实是一个很简单的需求,本来以为在FCKeditor能够很简单的完成
在Google上查找自定义按钮,插件开发,通过近二个小时的摸索终究还是没有完成不知是我太笨还是自定义插件太难啦
通过JS方法来处理
1.在页面中增加checkbox元素并绑定事件,选中该元素时将在FCKeditor内容里增加"{#book#}"字符串(该字符串会在恰当的时候被替换成其他内容),撤销选中时则删去
增加/删去复选框
2.增加Js处理FCKeditor内容(增加或删去"{#book#}"字符串),'txtContent’为FCKeditor的ID控控件ID
参阅:
官网:http://ckeditor.com/
获取或更改内容值:http://bbs.csdn.net/topics/360086762
创建插件:http://docs.cksource.com/FCKeditor_2.x/Developers_Guide/Customization/Plug-ins
接着给大家分享一下JS操作Fckeditor的一些常用方法
//向编辑器刺进指定代码
function insertHTMLToEditor(codeStr){
var oEditor = FCKeditorAPI.GetInstance(“content”);
oEditor.InsertHtml(codeStr); // "html"为HTML文本
}
//获取编辑器中HTML内容
function getEditorHTMLContents() {
var oEditor = FCKeditorAPI.GetInstance(“content”);
return(oEditor.GetXHTML(false));
}
// 获取编辑器中文字内容
function getEditorTextContents(www.bmc8888.com) {
var oEditor = FCKeditorAPI.GetInstance(“content”);
return(oEditor.EditorDocument.body.innerText);
}
// 设置编辑器中内容
function SetEditorContents(ContentStr) {
var oEditor = FCKeditorAPI.GetInstance(“content”) ;
oEditor.SetHTML(ContentStr) ;
}
//向编辑器刺进指定代码
function insertHTMLToEditor(codeStr){
var oEditor = FCKeditorAPI.GetInstance( "content ");
if (oEditor.EditMode==FCK_EDITMODE_WYSIWYG){
oEditor.InsertHtml(codeStr);
}else{
return false;
}
}
//计算编辑器中内容的字数
function getLength(){
var oEditor = FCKeditorAPI.GetInstance( "content ");
var oDOM = oEditor.EditorDocument;
var iLength ;
if(document.all){
iLength = oDOM.body.innerText.length;
}else{
var r = oDOM.createRange();
r.selectNodeContents(oDOM.body);
iLength = r.toString().length;
}
alert(iLength);
}
//履行指定动作
function ExecuteCommand(commandName){
var oEditor = FCKeditorAPI.GetInstance( "content ") ;
oEditor.Commands.GetCommand(commandName).Execute() ;
}
转自脚本之家