右键弹出菜单,给编辑内容增加上下标

//事件注册

listeners:{
render : function() {
Ext.fly(this.el).on('contextmenu',
function(e, t) {
e.preventDefault();
e.stopPropagation();
var textBox = document.getElementById(t.id);
var selection = document.selection;
var target = e.target;
insertStart = 0;
insertEnd = 0;
if (typeof(target.selectionStart) != 'undefined') {
insertStart = target.selectionStart;
insertEnd = target.selectionEnd;
} else if (selection && selection.createRange) {
var tr = textBox.createTextRange();
var r = selection.createRange();
tr.setEndPoint('endtoend', r);
insertStart = tr.text.length - r.text.length;
insertEnd = tr.text.length;
}
needInsertObj = textBox;
rightClick.showAt(e.getXY());
});

var needInsertObj;
var insertStart;
var insertEnd;

var rightClick = new Ext.menu.Menu({
id : 'rightClickCont', // 在HTML文件中必须有个rightClickCont的DIV元素
items : [{
id : 'insertSUP',
handler : insertSUP,// 点击后触发的事件
text : '插入上标'
}, {
id : 'insertSUB',
handler : insertSUB,
text : '插入下标'
}]
});
function insertSUP(){
var itemForm = new Ext.FormPanel({
frame : false,
plain : false,
bodyStyle : 'padding:5px 5px 0;background:transparent',
defaultType : 'textfield',
items: [{
fieldLabel : '上标内容',
id : 'supContent',
readOnly : false,
name : 'supContent',
anchor : '80%'
}
]
});
var win = new Ext.Window({
width : 430,
//height : 280,
title : '添加上标',
modal : true,
closable : false,
resizable : false,
autoDestroy : true,
//closeAction : 'hide',
bodyStyle : 'padding:10px 12px 10px 10px ',
items : [itemForm],
buttons : [{
text : '确定',
handler : function() {
if(itemForm.findById('supContent').getValue()==''){
}else{
needInsertObj.value = 	needInsertObj.value.substring(0,insertStart)
+ '<sup>' + itemForm.findById('supContent').getValue() + "</sup>" +
needInsertObj.value.substring(insertEnd);
}
win.close();

}
},{
text : '关闭',
handler : function() {
win.close();
}
}]
}).show();
}
function insertSUB(){
var itemForm = new Ext.FormPanel({
frame : false,
plain : false,
bodyStyle : 'padding:5px 5px 0;background:transparent',
defaultType : 'textfield',
items: [{
fieldLabel : '下标内容',
id : 'subContent',
readOnly : false,
name : 'subContent',
anchor : '80%'
}
]
});
var win = new Ext.Window({
width : 430,
//height : 280,
title : '添加下标',
modal : true,
closable : false,
resizable : false,
autoDestroy : true,
//closeAction : 'hide',
bodyStyle : 'padding:10px 12px 10px 10px ',
items : [itemForm],
buttons : [{
text : '确定',
handler : function() {
if(itemForm.findById('subContent').getValue()==''){
}else{
needInsertObj.value = 	needInsertObj.value.substring(0,insertStart)
+ '<sub>' + itemForm.findById('subContent').getValue() + "</sub>" +
needInsertObj.value.substring(insertEnd);
}
win.close();

}
},{
text : '关闭',
handler : function() {
win.close();
}
}]
}).show();
}