Animation ExtJS中具有相同父容器的多个元素上的并发fx

我有一个ExtJS GridPanel和相关的RowSelectionModel和GridView。当用户选择一些行并单击go时，我希望所有选中的行都闪烁几次

目前，我正在做一些类似的事情：

selModel.each(function (record) {

  var doEffect = function (effect, row, color, count, classToToggle) {

     var effectCallback = function (count, max) {
        if (count < max) {
            return (function () { row[effect](color); });
        }
        else {
           return (function () { row.addClass(classToToggle); });
        }
      };

      row.removeClass(classToToggle);
      for (var i = 1; i <= count; i++) {
         row[effect](color, { callback: effectCallback(i, count) });
       }
  };


  // highlight selected rows
  var row = Ext.get(grid.getView().getRow(grid.store.indexOf(record)));

  // essentially calling row.highlight() 3 times 
  doEffect('highlight', row, 'f8f7d6', 3, 'x-grid3-row-selected');  
}

问题是，随着选定行数的增加，视觉效果不再同时发生。我知道您可以在effect配置中指定concurrent，这会导致排队等待该元素同时发生的所有效果，但是因为所有行都是不同的元素，所以这不太管用

如果我能在父容器上指定concurrent，使动画在最后一个选定行准备就绪之前不会发生，那就太棒了

---

以前有人遇到过这种情况吗？

您正在为每一行依次设置回调计时器，因此它们可能在不同的时间触发。 尝试设置一个计时器，并在其中同时更改所有选定的行

也就是说，从外部移除selModel.each循环，并使doEffect和effectCallback获取行集合或查询selModel本身，以便在每次调用时进行更改

---

它将运行得更快，即消耗更少的周期，因为一次只能运行一个计时器。

我最终尝试制作一个只包含我想突出显示的行的CompositeElement，我认为这大致就是您所建议的，虽然它更快，但速度不够快。我最终采用的解决方案是用css类进行伪装，让浏览器完成优化的繁重工作。基本上，我在整个容器上创建了一个css类。然后，我设计了父级“highlight”类和先前存在的行类“x-grid3-row-selected”的组合样式，使其具有与真实高光效果相同的样式。我希望评论让我格式化代码