fadeOut错误/递减实现

Question

因此，对于这个项目，我需要淡出包括照片及其相应标题的各个元素。然而，当我点击图片时，它会将所有内容都淡出。我该如何解决这个问题，这样当我点击照片/照片标题时，只有那个元素会淡出？

我在递减itemCount.innerHTML = There are ${length} photo(s) being shown时也遇到了问题。因此，当每一张单独的照片逐渐消失时，它的长度就会减少。我如何才能实现这一点，从而使其相应地发挥作用？

最后，我设置了一个容器，每行容纳4张照片，但每行只包含2张照片。如何修复此问题，使其每行包含4张照片？

提前感谢！

https://jsfiddle.net/fengdenn/f4qxywpt/4/

Answer 1

你非常接近。fadeOut回调有一个事件参数，事件对象包含实际单击的#container的子对象。

通过向回调函数添加事件参数：

function fadeOut(event) 

然后使用此事件对象引用点击源：

let fadeTarget = document.getElementById("container");

成为

let fadeTarget = event.target

现在您正在运行的淡入淡出功能是特定的块。也许可以看看已经输出到控制台的事件对象，以备将来参考。

我想这会得到你想要的。祝你好运

https://jsfiddle.net/z6um1dpv/4/