首页前端开发其他前端知识FCK编辑器(FCKEditor)添加新按钮和功能的修改方法

FCK编辑器(FCKEditor)添加新按钮和功能的修改方法

时间2024-02-10 11:19:03发布访客分类其他前端知识浏览492
导读:收集整理的这篇文章主要介绍了FCK编辑器(FCKEditor)添加新按钮和功能的修改方法,觉得挺不错的,现在分享给大家,也给大家做个参考。 需要修改的文件: fckconfig.js z...
收集整理的这篇文章主要介绍了FCK编辑器(FCKEditor)添加新按钮和功能的修改方法,觉得挺不错的,现在分享给大家,也给大家做个参考。 需要修改的文件:

fckconfig.js
zh-cn.js
en.js
fckedITorcode_gecko.js || fckeditorcode_ie.js(针对IE以外的浏览器||针对ie浏览器,如果要支持两种浏览器,就这两个包都修改)

第一步:在Toolbar中添加功能按钮
fckconfig.js:FCKConfig.ToolbarSets[“Default”] 中添加按钮名称
FCKConfig.ToolbarSets["Default"] = [
['Bold','Italic','-','About', 'myDIY']
] ;

第二步:为按钮添加中文名称和英文名称

zh-cn.js:为你的按钮起个中文名字
mydiy : “我的自定义按钮"

en.js:为你的按钮起个英文名字
mydiy:"mydiybutton"

第三步:在Toolbar中显示该按钮

fckeditorcode_gecko.js(fckeditorcode_ie.js):
查找:

case 'NewPage':B=new FCKToolbarButton('NewPage',FCKLang.NewPage,null,null,true,null,4); break;
在break后插入你的代码

比如case 'mydiy':B=new FCKToolbarButton('mydiy',FCKLang.mydiy,null,null,false,true,50); (这个50是按钮的显示图片,要让你的自定义按钮显示为插入图片那个按钮的图片,可以填入37)
这样就可以在Toolbar中显示你的按钮了

第四步:定义按钮功能原型

ckeditorcode_gecko.js(fckeditorcode_ie.js):

查找:

VAR FCKNewPageCommand=function(){ this.Name='NewPage'; } ;
FCKNewPageCommand.PRototyPE.Execute=function(){ FCKUndo.SaveUnDOStep(); FCK.SetHTML(''); FCKUndo.Typing=true; } ;
FCKNewPageCommand.prototype.Getstate=function(){ return FCK_TRISTATE_OFF; } ;
定义功能原型:(这里直接复NewPage的实现代码放到后面,然后进行修改)

比如:var FCKmydiyCommand=function(){ this.Name='mydiy'; } ; FCKmydiyCommand.prototype.Execute=function(){ 这里写你所需要执行的代码或者函数,比如alert("I am here !"); } ; FCKmydiyCommand.prototype.GetState=function(){ return 0; } ;
将上面代码插入到查找内容之后。

第五步:按钮功能实例化:

ckeditorcode_gecko.js(fckeditorcode_ie.js):

查找:

case 'NewPage':B=new FCKNewPageCommand(); break;
功能实例化:
case 'mydiy':B=new FCKmydiyCommand(); break;
将上面代码插入到查找内容之后。

OK,这样就可以在为FCKeditor加上自定义的按钮了。

如果要为按钮加上快捷键,可以在fckconfig.js中:FCKConfig.Keystrokes = []加上
[ CTRL + 71 /*G*/, 'mydiy' ],

来自:萍客小居 (http://www.piikee.net/) 您可能感兴趣的文章:
  • FCKeditor添加自定义按钮的方法
  • FCKeditor添加自定义按钮
  • CKEditor自定义按钮插入服务端图片

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!


若转载请注明出处: FCK编辑器(FCKEditor)添加新按钮和功能的修改方法
本文地址: https://pptw.com/jishu/608290.html
伪静态下不能使用FCKeditor的解决方法 浏览器执行history.go(-1) FCKeditor编辑框内显示html源代码的解决方法

游客 回复需填写必要信息