jquery - 更改父 div 的复选框 attr onclick

Question

我有一个输出图像的 php 脚本，目前要选择图像，您必须单击复选框。我想更改此设置，以便在单击父 div 时将复选框设置为选中。

如果我的父 div 有不同的 id，我知道如何执行此操作，并且该类似乎不好，因为它会将 php 输出的所有复选框设置为 true/false。

这是我到目前为止所拥有的:

JQuery

$('#div').bind('click', function() {
   var checkbox = $(this).find(':checkbox');

    checkbox.attr('checked', !checkbox.attr('checked'));
});

HTML(由php输出，因此存在多个。)

<div id="div" style='display:inline-block; padding:15px;' class='lifted drop-shadow-sq'>
    <img class='reflect reflect-br'  width='150px' height='150px' src=\"thumb.php?id=$id\">
        <input type='checkbox' class=\"show-man\" name=\"images[]\" value='$id'>
</div>

那么，当单击父 div 时，如何将复选框设置为选中状态，而不会导致任何其他复选框之间发生冲突？

感谢您提前提供的任何帮助。

Answer 1

您的选择器错误，标记中没有 ID 为 div 的元素， 您可以使用 prop 方法:

$('div').on('click', function() {
   $('input[type=checkbox]', this).prop('checked', function(i, checked){
      return !checked
   })
});

请注意，:checkbox 选择器已被弃用，并且 ID 必须是唯一的，如果您有多个具有相同 ID 的元素，则您的标记无效，并且您的 ID 选择器仅选择具有该特定 ID 的第一个元素，你应该使用类。

$('.div').on('click', function() {