jquery - 单击处理程序在 css 转换后未在 chrome 中触发

Question

我有两个 div，它们使用 CSS 过渡交替/翻转两侧。

transform: rotateX(90deg) translateZ($cube-height*1.7);

我有一个适用于两个 div 的点击处理程序，但只有第一个触发事件。

$('.cube-face').on('click',function(){
    window.location = ($(this).attr('data-draw-link'));
});

我创建了 a fiddle为了演示这一点，点击处理程序只显示一个警告窗口。 我读过类似的问题，但尚未找到解决此问题的方法。我曾尝试改变背面可见性和视角，但没有成功。

如何让点击处理程序为第二个 div 触发？

此错误发生在 Chrome 中。

Answer 1

点击父元素，比较“e.target”和“this”。

//go to this draws results on click
$('#resultsFlipper').on('click',function(e){
    if(e.target == this){
        alert("green");
    } else {
        alert("red");
    }
});

here is your updated fiddle