Extjs 如何临时高亮显示Ext JS网格面板的可编辑列（版本4.2.1）

我使用的是ExtJS4.2.1中的网格面板。我有一些带有编辑器的列定义：“textfield”（可编辑列），还有一些没有编辑器（只读列）

我想要什么

我想在鼠标悬停事件中将背景色的可编辑列临时高亮显示到该特定列

我请求帮助。请导游。我在这上面花了很多时间，但都是徒劳的：(

问候,， 贾格里特·辛格

任务-当鼠标放在下面可编辑的列1和列2上（具有编辑器配置选项）时，我希望目标列用一些明亮的颜色暂时高亮显示几秒钟

Ext.define('XX.view.account.Portfolios', {
extend : 'Ext.grid.Panel',
plugins : {
    ptype : 'cellediting',
    clicksToEdit : 1
},
columns : [{
    text : 'Read Only 1',
    flex : 1,
    sortable : true,
    dataIndex : 'ro1'
}, {
    text : 'Read Only 2',
    flex : 2,
    sortable : true,
    dataIndex : 'ro2'
}, {
    text : 'MV',
    flex : 1,
    sortable : true,
    dataIndex : 'mv'
}, {
    text : 'Editable 1',
    flex : 1,
    sortable : true,
    dataIndex : 'e1',
    editor : 'textfield'
}, {
    text : 'Editable 2',
    flex : 1,
    sortable : true,
    dataIndex : 'e2',
    editor : 'textfield'
}

---

正如Lorenz所建议的，您可以捕获itemmouseenter事件，然后通过调用highlight方法高亮显示可编辑行，为了只高亮显示那些与编辑器关联的单元格，您可能可以使用应用于这些列的类，然后在鼠标上选择匹配的元素，然后输入事件指针呃，像这样的：

itemmouseenter: function (grid, record, item, index, e, eOpts) {
        var node = grid.getNode(record);
        var cells = Ext.dom.Query.select('.editable-cell', node);

        for (var i = 0; i < cells.length; i++) {
            Ext.fly(cells[i]).highlight();
        }
    }

itemmouseenter:函数（网格、记录、项、索引、e、eOpts）{
var node=grid.getNode（记录）；
var cells=Ext.dom.Query.select（'.editable cell'，node）；
对于（变量i=0；i

你可以看到一个。

---

希望它有助于解决您的问题

CSS动画的另一个选项：

将鼠标悬停在事件上方并使用.getEl（）.highlight（）方法。问题可能是IE我没有话要感谢您。帮了大忙。非常感谢。效果很好：）不使用IE:（我使用IE9。请指导。我也尝试了下面提到的动画css选项。没有任何效果。你解决了你的问题吗？如果没有，你能提供一个示例代码让我试试吗？很抱歉延迟响应我整个星期都不在电脑旁。这个解决方案适用于Firefox，但不适用于IE（9）。我还尝试了下面提到的其他选项-CSS动画，但在IE（9）上也不起作用。只需在IE（9）上打开上面提供的工作示例。感谢您的帮助。