在MS Edge中的伪元素上进行CSS转换后，如何运行一些javascript？

我在Microsoft Edge中处理伪元素上的“transitionend”事件时遇到问题

它适用于其他浏览器，如chrome、safari和firefox。我认为这可能是微软Edge的一个缺陷，但它在IE11中也不起作用，所以也许在微软的世界里，我还缺少其他的方法

有人知道如何在IE中处理这个问题吗

这是密码。。。如果正确处理transitionend事件，则淡入完成后，该框将变为绿色

window.setTimeout（函数（）{
$（“#框”）.one（'transitionend WebKittTransitionEnd otTransitionEnd MSTransitionEnd'，function（）{
$（this.addClass（'done'）；
});
$（'#box'）.addClass（'show'）；
},1);
#框{
位置：相对位置；
}
#盒子：之前{
位置：绝对位置；
高度：100px；
宽度：100px；
背景色：番茄；
过渡：不透明度1s；
不透明度：0；
内容：“；
}
#盒子。显示：之前{
不透明度：1；
}
#盒子。完成：之前{
背景颜色：绿色；
}
如果使用jQuery的.animate（）函数，则可以将函数放在要运行的末尾，如下所示：

$(document).ready(function() {
  $('#box').animate({opacity: 1}, 1000, function() {
    $('#box').animate({background-color: green}, 1000);
  });
});

背景色只有在完成淡入后才会转换为绿色。希望这有帮助

#box {
  position: relative;
}
#box > .before {
  position: absolute;
  height: 100px;
  width: 100px;
  background-color: tomato;
  transition: opacity 1s;
  opacity: 0;
  content: "";
}
#box.show > .before {
  opacity: 1;
}
#box.done > .before {
  background-color: green;
}

IE11在伪元素上的transitionend存在问题。如果在父容器中添加了额外的元素。这对我有用
 谢谢，但这不适用于为伪元素上的属性设置动画，如：before。我在我的真实项目中使用了伪元素，这样我可以使背景图像褪色，下面是默认图像，顶部是色调/渐变。