html加上 extjs右键,ExtJS：向htmleditor添加按钮

您无需切换到HTML模式.只需将insertAtCursor函数与HTML模板一起使用即可.

我做了一个简单的例子,说明如何添加插入水平标尺的按钮(< 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('

---

');

},

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()]

}]

});

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