jQuery单击事件触发多个元素（我只想要1）(jQuery Click Event Triggering On Multiple Elements (I only want 1))

jQuery单击事件触发多个元素（我只想要1）(jQuery Click Event Triggering On Multiple Elements (I only want 1))

当我的叠加层出现时，一切都运行良好，但我添加了一些代码来关闭叠加层，但即使我只是单击箭头，此代码也会被触发。 以下是被触发的代码，当我没有单击箭头来更改图像时这很好。 但是当我单击箭头时，作为叠加层的背景也会被触发，因此图像正在改变，但叠加层也在隐藏。

$('#overlay').click(function() { $(this).fadeOut('slow'); });

如何在没有它的情况下使用箭头同时点击背景叠加？ 如果你打开项目，你会看到我在说什么。

要打开项目： https ： //htmlpreview.github.io/？https ： //github.com/rodriguesandrewb/photo_gallery_v1/blob/master/index.html

要打开存储库： https ： //github.com/rodriguesandrewb/photo_gallery_v1

When my overlay comes up, everything works well, but I added some code to close out the overlay, but this code gets triggered even when I'm just clicking my arrows. The following is the code that's being triggered, which is fine when I'm not clicking the arrows to change the image. But when I click the arrows, the background which is the overlay is also being trigger, so the image is changing but the overlay is also hiding.

$('#overlay').click(function() { $(this).fadeOut('slow'); });

How can I be able to use the arrows without it also clicking on the background overlay? If you open up the project, you will see what I'm saying.

To open the project: https://htmlpreview.github.io/?https://github.com/rodriguesandrewb/photo_gallery_v1/blob/master/index.html

To open the repository: https://github.com/rodriguesandrewb/photo_gallery_v1

最满意答案

您想使用event.stopPropagation() ： https ： event.stopPropagation()

这可以防止事件冒泡（由其他元素触发）

You want to use event.stopPropagation(): https://api.jquery.com/event.stoppropagation/

This prevents the event from bubbling (being triggered by other elements)