设置htmleditor Extjs 6的光标位置

Question

我在我的应用程序中使用了htmleditor，我希望在20个字符之后更改文本的颜色。

所以前20个字符看起来是黑色的，之后都是橙色

为此我正在使用此代码：

{
    xtype: 'htmleditor',
    value: record.data.description,
    height: 100,
    width: 900,
    name: 'instructionDescription',
    enableColors: false,
    enableFontSize: false,
    allowBlank: false,
    enableSourceEdit: false,
    enableLinks: false,
    enableFont: false,
    enableAlignments: false,
    enableLists: false,
    colspan: 2,
    style: {
        'margin-left': '10px'
    },
    listeners: {
        change: function(Object, newValue, oldValue) {
            if (typeof(newValue) != 'string')
                return;

            var newVal = Ext.util.Format.stripTags(newValue);
            var oldVal = Ext.util.Format.stripTags(oldValue);
            var index = newValue.indexOf('<font color="#ffa500">');
            var velue = null;
            if (newVal == oldVal)
                return;

            if (index > -1) {
                value = newValue.substr(0,index) + '<font color="#ffa500">' + newValue.substr(index + 22);
                this.setValue(value);
            }
            else {
                if (newVal.length > 20) {
                    newValue = newValue.replace('&nbsp;', " ");
                    newVal = Ext.util.Format.stripTags(newValue);
                    if (newVal.length < 21) {
                        return;
                    }
                    index = newValue.indexOf(Ext.util.Format.stripTags(newValue).substr(15,5));
                    index += 5;
                    value = newValue.substr(0,index) + '<font color="#ffa500">' +newValue.substr(index);
                    value = value.replace('&nbsp;', " ");
                    this.setValue(value);
                }
            }
        },
        afterrender: function() {
            var value = record.data.description;
            if (Ext.util.Format.stripTags(value).length > 20) {
                var index = value.indexOf(Ext.util.Format.stripTags(value).substr(20));
                value = value.substr(0,index) + '<font color="#ffa500">' + value.substr(index);
                value = value.replace('&nbsp;', " ");
            }
            this.setValue(value);
        }
    }
}

现在问题是当光标样式应用于20个字符后的字符串时，我的光标会回到第一个位置。

有没有办法阻止光标返回第一个位置或手动设置光标位置的任何方式。