CKEDITOR 3.4.2中按钮事件中动态改变图标和title 获取按钮

最新推荐文章于 2021-10-26 18:08:42 发布

weixin_30633507

最新推荐文章于 2021-10-26 18:08:42 发布

阅读量132

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/hutuchong/p/6513219.html

本文介绍如何使用jQuery和CKEditor API动态地修改CKEditor插件中的按钮标题和图标样式，包括根据条件更改按钮的背景图像。

this.uiItems[0].className="cke_button_hui_position_type";
this.uiItems[0].title="zhang";
//上面2中只是获取，修改后不管用

this.uiItems[0]._.id  //获取ID

//只能通过jquery，找到id或classname来找到，然后修改

$("#cke_18")[0].title


完整代码：

 editor.addCommand('sunyard_position_type',{
            exec:function(editor){
                CKEDITOR.positionType = CKEDITOR.positionType=='absolute'?'static':'absolute';
                //动态设置图标title和lable
                $("." + this.uiItems[0].className)[0].label= lang[CKEDITOR.positionType];
                $("." + this.uiItems[0].className)[0].title= lang[CKEDITOR.positionType];
                //改变图标
                //alert(editor.plugins.sunyard_position_type.path);
                if(CKEDITOR.positionType=="absolute") {
                    $("."+this.uiItems[0].className)[0].children[0].style.backgroundImage="url("+editor.plugins.sunyard_position_type.path+ "icons/sunyard_position_type_absolute.gif"+")";
                }else{
                    $("."+this.uiItems[0].className)[0].children[0].style.backgroundImage="url("+editor.plugins.sunyard_position_type.path+ "icons/sunyard_position_type_static.gif"+")";
                }
            }
        });