之前在一个系统里使用了FCKeditor编辑器，由于项目需求需要在FCKeditor里添加一个自定义的按钮用于实现自己的需求
主要是在点击该按钮时删除或添加FCKeditor编辑器里的内容
其实是一个很简单的需求，本来以为在FCKeditor可以很容易的实现
在Google上搜索自定义按钮,插件开发，经过近二个小时的摸索最终还是没有实现不知是我太笨还是自定义插件太难啦
通过JS方式来处理
1.在页面中添加checkbox元素并绑定事件,选中该元素时将在FCKeditor内容里添加"{#book#}"字符串(该字符串会在适当的时候被替换成其他内容),取消选中时则删除
<label><input type="checkbox" id="lineBook" onclick="chk_but();"/>添加/删除复选框</label>
2.添加Js处理FCKeditor内容(添加或删除"{#book#}"字符串),'txtContent'为FCKeditor的ID控控件ID
<script type = "text/javascript" >
//"添加/删除复选框"点击时如果按钮选中则添加"{#book#}"字符串到FCK内容里，反之删除字符串
//lineBook为FCK的ID号
function chk_but() {
if (window.FCKeditorAPI !== undefined && FCKeditorAPI.GetInstance('txtContent') !== undefined) {
if (document.getElementById('lineBook').checked) {
FCKeditorAPI.GetInstance('txtContent').EditorDocument.body.innerHTML += "{#book#}";
} else {
FCKeditorAPI.GetInstance('txtContent').EditorDocument.body.innerHTML = FCKeditorAPI.GetInstance('txtContent').EditorDocument.body.innerHTML.replace("{#book#}", "");
}
}
} //end function chk_lineBook()
//内容里如果有{#book#}则选中"添加/删除复选框"
if (document.getElementById('txtContent').value.indexOf('{#book#}') >= 0
&& window.FCKeditorAPI !== undefined
&& FCKeditorAPI.GetInstance('txtContent') !== undefined) {
document.getElementById('lineBook').checked = true;
}
</script>
参考：
官网：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() {
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() ;
}
Js操作FCKeditor编辑器
免责声明：本站文章均来自网站采集或用户投稿，网站不提供任何软件下载或自行开发的软件！ 如有用户或公司发现本站内容信息存在侵权行为，请邮件告知！ 858582#qq.com
P70系列延期，华为新旗舰将在下月发布
3月20日消息，近期博主@数码闲聊站 透露，原定三月份发布的华为新旗舰P70系列延期发布，预计4月份上市。
而博主@定焦数码 爆料，华为的P70系列在定位上已经超过了Mate60，成为了重要的旗舰系列之一。它肩负着重返影像领域顶尖的使命。那么这次P70会带来哪些令人惊艳的创新呢？
根据目前爆料的消息来看，华为P70系列将推出三个版本，其中P70和P70 Pro采用了三角形的摄像头模组设计，而P70 Art则采用了与上一代P60 Art相似的不规则形状设计。这样的外观是否好看见仁见智，但辨识度绝对拉满。