每个复选框上的事件触发

Question

我有几张图片，旁边是复选框，它不会单独显示，但如果点击标签触发复选框 true 或 false，现在我认为一切都很好，直到我不得不使用 @987654322 @ 所以每个复选框都会响应它的元素，我的代码会运行，但是当一个复选框被选中时，它会触发每个图像的所有事件。

 $(".suggestions").click(function() {
   if ($(".checkbox").prop('checked') === true) {
     $("h2").fadeIn("fast").fadeOut(5000)
   }
   if ($(".checkbox").prop('checked') === false) {
     $("h2").fadeIn("fast").fadeOut(5000)
   }
 })

基本上，单击复选框时的代码会显示已添加的消息，而取消选中时会显示已删除和消失的消息。 我怎样才能让它工作，所以它使用this？这是我的fiddle

Answer 1

这适用于每个带有类型复选框的输入，并且如果您还保留此结构。

$('input:checkbox').on('change', function() {
    if ($(this).prop('checked') === true) {
        $(this).parent('div').siblings('.flex-column').children('h2.addMsg').fadeIn("fast").fadeOut(5000);
    } else {
        $(this).parent('div').siblings('.flex-column').children('h2.removeMsg').fadeIn("fast").fadeOut(5000);
    }
});

如果您有任何问题，请告诉我。

编辑：

当然你可以用类名kdng替换input:checkbox。