jQuery -折射代码(图库)

Question

我创建了一个黑白图片库(使用CSS的属性filter: grayscale())。

如果用户点击其中一张图片，我希望这张照片显示它的实际颜色。

我写了下面的代码，但是，我不知道如何避免硬编码和创建一个干代码(这样如果我添加50张图片，我就不必添加额外的代码)。

请帮助。

$('document').ready(() => {
$('img').click(() => {
if ($('img').is("#1")) {
$('#1').css("filter", "none");
} else if ($('img').is("#2")) {
$('#2').css("filter", "none");
}
etc.

Answer 1

听起来您可能只需要使用完整的function并使用this来代替:

$('document').ready(() => {
$('img').click(function() {
$(this).css('filter', 'none');
});
});

如果您有不希望此侦听器激活的图像，则给出您做的所有图像希望侦听器在类上激活，如galleryImg，然后执行

$('.galleryImg')

不是

$('img')