javascript - 如何使用jQuery淡出多个图像？

我想在点击图像后以3秒的延迟淡出这3张图像。我目前编写的代码无法正常工作。有人可以解释为什么吗？谢谢！我以为“这”是指3个ID标签。

另外，如果有更简单的方法，请分享。

<script>

$(function(){
  ('#img1, #img2, #img3').click(function() {
    $(this).fadeOut(3000);
  });
});
</script>


<div class="flex-container">
 <img id="img1" src="http://media.creativebloq.futurecdn.net/sites/creativebloq.com/files/images/2015/09/google_logo.jpg">
 <img id="img2" src="http://media.creativebloq.futurecdn.net/sites/creativebloq.com/files/images/2015/09/google_logo.jpg">
 <img id="img3" src="http://media.creativebloq.futurecdn.net/sites/creativebloq.com/files/images/2015/09/google_logo.jpg">
</div>

</body>
</html>

最佳答案

fadeOut将在3秒内（而不是3秒后）使图像褪色，请使用

$('.image').click(function() {
    setTimeout(function(){
        $(this).fadeOut(3000);
    }, 3000);
});

对图像使用通用类，以便可以在不久的将来进行扩展。
在回叫淡入图像中。