Javascript 如何在extJs中输入的文本字段中为每个电子邮件创建不同的div？

我已经创建了一个文本字段，需要将电子邮件作为输入。我想把选择的每封邮件放在不同的背景色中（让它更友好）。在ExtJS中有什么方法可以做到这一点吗

请参考代码中的id“emailTo”。谢谢

Ext.define（'App.ux.form.field.MultipleInputValueField'{
扩展：“Ext.form.field.Tag”，
别名：['widget.multiinputvaluefield'，'widget.multiinputvalue']，
/**@type函数*/
validationFn:null，
/**@type正则表达式*/
validationRe:null，
filterPickList：是的，
/**
*设置
*@type数组（输入，；）
*/
按键：[13、186、188]，
拆分字符：/[\n，；]/,，
initComponent:function（）{
var me=这个；
变量defConfig={
是的，
显示字段：“id”，
enableKeyEvents:true，
存储：Ext.create（'Ext.data.store'{
字段：[{name:'id'，type:'string'}]，
idProperty:“id”
})
};
Ext.apply（me，defConfig）；
me.callParent（）；
},
听众：{
键控：功能（me，e）{
var input=me.el.down（'input'）.dom，
strArray=input.value.split（me.splitChars）；
if（strArray.length>1 | | Ext.Array.contains（me.keyPressKeys，e.keyCode））{
var VAL=[]；
Ext.each（strArray，函数（str）{
str=str.trim（）；
if（Ext.isEmpty（str））
回来
if（（me.validationFn&&Ext.isFunction（me.validationFn）&&！me.validationFn（str））||
（me.validationRe&！me.validationRe.test（str）））
return me.markInvalid（me.invalidText | |'此字段无效'）；
推力（str）；
});
Ext.each（（me.value | |[]）.reverse（），函数（val）{
val.取消移位（val）；
});
me.设定值（VAL）；
}
}
},
setValue：函数（值、添加、skipLoad）{
var me=this，data=[]，vals=[]；
如果（！Ext.isEmpty（value））{
if（外部isString（值））
value=value.split（me.splitChars）；
如果（！Ext.isArray（值））
值=[值]；
var addValues=函数（val）{
如果（分机isEmpty（val））
回来
if（外部isString（val））{
data.push（{id:val}）；
推力（val）；
}else if（外部等深线（val）和val.isModel）{
data.push（{id:val.get（'id'）}）；
vals.push（val.get（'id'））；
}否则，如果（分机isArray（val））{
附加值（val）；
}
};
Ext.each（值、函数（val）{
附加值（val）；
});
}
如果（me.el）
me.el.down（'input'）.dom.value=''；
me.getStore（）.loadData（数据）；
App.ux.form.field.MultipleInputValueField.superclass.setValue.apply（me[vals]）；
}
})；

使用标记字段组件。

var emailDlg = new Ext.Window(
            {
                width : 900,
                height : 600,
                minWidth : 300,
                minHeight : 220,
                closable : false,
                modal : true,
                resizable : false,
                autoDestroy : true,
                title : 'New email notification',
                layout : 'fit',
                buttonAlign : 'center',
                items : [ {
                    xtype : 'form',
                    defaultType : 'textfield',

                    fieldDefaults : {
                        labelWidth : 60
                    },
                    layout : {
                        type : 'vbox',
                        align : 'stretch',
                        pack : 'start'
                    },
                    bodyPadding : 5,
                    border : false,
                    items : [ {
                        id : 'emailTo',
                        fieldLabel : 'To',
                        id : 'textInput',
                        name : 'to'
                    }, {
                        id : 'emailSubject',
                        fieldLabel : 'Subject',
                        name : 'subject'
                    }, {
                        id : "msgbody",
                        autoDestroy : true,
                        xtype : 'displayfield',
                        hideLabel : true,
                        name : 'msg',
                        flex : 1
                    } ]
                } ],
});