ExtJS：向htmleditor添加按钮

我正在使用ExtJS,我的表格中有一个htmleditor.我想为该元素添加一个自定义按钮(例如在对齐,字体权重等所有其他按钮之后).这个按钮基本上应该在htmlfield中插入一个标准模板.作为这个模板html,按钮的行为应该是这样的

>切换到HTML模式(如按Source按钮时)
>插入一些东西
>切换回WYSIWYG模式(比如再次按下Source按钮)

感谢您的关注

解决方法

我做了一个简单的例子,说明如何添加插入水平标尺的按钮(< hr>标记)：

Ext.ns('Ext.ux.form.HtmlEditor');

Ext.ux.form.HtmlEditor.HR = Ext.extend(Ext.util.Observable,{
    init: function(cmp){
        this.cmp = cmp;
        this.cmp.on('render',this.onRender,this);
    },onRender: function(){
        this.cmp.getToolbar().addButton([{
            iconCls: 'x-edit-bold',//your iconCls here
            handler: function(){
                this.cmp.insertAtCursor('<hr>');
            },scope: this,tooltip: 'horizontal ruler',overflowText: 'horizontal ruler'
        }]);
    }
});
Ext.preg('ux-htmleditor-hr',Ext.ux.form.HtmlEditor.HR);

Ext.QuickTips.init();
new Ext.Viewport({
    layout: 'fit',items: [{
        xtype: 'htmleditor',plugins: [new Ext.ux.form.HtmlEditor.HR()]
    }]
});

你可以看到它运行于：jsfiddle.net/protron/DCGRg/183/

但我真的建议你查看HtmlEditor.Plugins(或者说是ateodorescu/mzExt for ExtJS 4).在那里你可以找到更多关于添加自定义按钮的信息,例如,如何在选择内容时启用/禁用按钮,放置分隔符等.

（编辑：源码网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!