暂时将CSS类添加到带有ember.js的DOM元素中

Question

背景信息：

我正在使用ember.js。

这是我的视图代码：

App.AddView = Ember.View.extend({
  classNameBindings: ['enter:enter:leave', 'dropped:dropped:leave'],
  enter: false,
   drop: function(event) {
     event.preventDefault();
     event.stopPropagation();
     this.set('dropped', 'true');
     this.set('text', 'Thanks');
   }
 });

和我的车把代码：

<script type="text/x-handlebars" id="add">
  {{#view App.AddView id="drop"}}
      {{msg}}
  {{/view}}
</script>

当我在上面放一个物品时，它说是"谢谢"，变成蓝色。很棒。

目标：

我想做的是将"感谢"和蓝色保持几秒钟，然后淡入Pageload上显示的常规颜色和消息。我找不到在ember.js中这样做的示例，我所有只使用常规jQuery做事的尝试似乎都无法正常工作。

问题：

我该如何制作操作（将类应用于元素，更改元素的文本等）。

类绑定将发生在绑定符合条件的那一刻。为了实现延迟/动画效果，您必须使用CSS3动画（可能会起作用的键帧动画），或使用jQuery。将jQuery用于动画和其他复杂的DOM操纵没有错。

从视图中，您可以使用this.$()方法访问示波器的jQuery对象。您可以做以下操作：

App.AddView = Ember.View.extend({  
   classNames: ['defaultState'],
   drop: function(event) {
     event.preventDefault();
     event.stopPropagation();
     this.$().animate({ backgroundColor: "#7cc9ea"}, 400);
     this.set('text', 'Thanks');
     Ember.run.later(this, function(){
       this.$().animate({ backgroundColor: "#FFFFFF"}, 400);
       this.set('text', '');
     }, 500);
   }
 });

为了使背景颜色动画，您将需要jquery-color插件。希望这可以帮助！：）

编辑：如果要为背景动画或以其他方式操纵嵌套元素的DOM，则可以像正常情况一样使用选择器访问它；请记住，它从视图元素开始，作为根节点。例如this.$('#myNestedButton')