jQuery 点击事件停止传播无法工作？

Question

我有一个画廊类型的界面，我试图开始工作，我希望能够单击它的外部来关闭它，但是里面有一个 div，其中包含主要元素、照片和要单击的内容。然而，就像现在一样，当您在 div 内部单击时，它会关闭，因为它是元素中的子元素，当您单击时，它会关闭。

我有这样的 div：

 <div class="theater-wrapper">
     <div class="theater-container"></div>
 </div>

所有内容都通过 ajax 加载到剧院容器中。 当您单击 .theater-wrapper 时，它应该触发事件关闭，但是当您单击 Theater-container 时，它不应该触发该事件。

这就是我尝试关闭它的方式：

$(".theater-wrapper").click(function (event) {
     $('.theater-wrapper').hide(); 
event.stopPropagation();

  });

我有一个 jsfiddle 显示此操作： http://jsfiddle.net /Cs8Kq/1/

Answer 1

如果您想停止在 .theater-container 上传播点击事件，那么您需要在其中放置命令。现在您已将其应用于 .theater-wrapper 点击操作。

$(".theater-container").click(function (ev) {
    ev.stopPropagation();
});