单击复选框时无法设置选中的属性

Question

我可以获取所点击的复选框的所有属性，但只能查看它。

$('body').off('click.checkbox').on('click.checkbox', '[data-checkbox]', function(event) {

    var id =  $(this).closest('[data-target]').attr('id');
    var target = $(event.target);

    if (target.is('input')) {

        if(target.is(":checked") == true) {

            console.debug($(this).find('input:checkbox').attr('id'));
            /*
                item-checkbox-1
                item-checkbox-2
            */

            //both below ways unable to check it
            $(this).find('input:checkbox').attr('checked', 'checked');
            $(this).find('input:checkbox').prop('checked', true);


           //but this checks all checkboxes found which is unintended
             find('input:checkbox').prop('checked', true);

            } else {

                //do smtg
            }

        } else {
            selectedItem.splice($.inArray(id, selectedItem),1);
        }
    }

});

这是复选框的样子，它无法检查点击的复选框：

HTML：

<div class="item-checkbox" data-checkbox>
    <div class="checkbox">
        <input type="checkbox" id="item-checkbox-2">
        <label for="item-checkbox-2"></label>
    </div>
</div>

Answer 1

您已使用target引用输入标记。因此，您可以直接使用$(this)来检查/取消选中。

所以，下面应该有用。

$(this).attr('checked', 'checked');
$(this).prop('checked', true);

Answer 2

尝试使用类型选择器替换input：复选框。如下：

$(this).find('input[type=checkbox]').attr('checked', 'checked');