Video-JS阻止来自propagationinig的click事件到子元素

Question

我使用Video-JS插件创建了一个简单的视频页面。视频在弹出模块中播放。我想要做的是在点击视频包装时关闭此弹出窗口，而不是视频。但我没有这样做，即使我点击视频控件弹出窗口关闭。我的代码如下所示：

$('.popup-video').click(function() {
    $(this).fadeOut(500);
    // Pause Video
});
$('.popup-video>div').click(function(e) {
    e.stopPropagation();
});
$('.popup-video>video').click(function(e) {
    e.stopPropagation();
});

用来做技巧的

.stopPropagation方法，但现在不行！我做错了什么？

Answer 1

你可以检查点击的元素（事件目标）是否实际上是事件处理程序（this）中引用的元素，并且只有在它是的时候才进行淡化。这样可以避免点击从子元素传播并触发函数的问题：

$('.popup-video').click(function(e) {
    if (e.target === this) $(this).fadeOut(500);
});