好的,所以我需要能够点击.modal-interest
中的任何元素,并在它被点击时检查子元素复选框。
目前,它似乎适用于第一次点击 - 但是对于每次后续点击,即使代码应该检查复选框,它也什么都不做。
$('.modal-interest strong').click(function (e) {
input = $(this).closest('.modal-interest').find('input');
if (input.prop('checked')) {
input.attr('checked', false).change();
} else {
input.attr('checked', true).change();
}
});
可以在以下小提琴中看到我问题的准确表示:
坚持这一点,并感谢任何帮助!
答案 0 :(得分:1)
您应该使用.prop()
代替:
$('.modal-interest strong').click(function (e) {
input = $(this).closest('.modal-interest').find('input');
if (input.prop('checked')) {
input.prop('checked', false).change();
$('h1').html('untick it');
} else {
input.prop('checked', true).change();
$('h1').html('tick it');
}
});
现在确实,您的代码应该是这样的:
$('.modal-interest strong').click(function (e) {
var input = $(this).closest('.modal-interest').find('input')[0];
input.checked = !input.checked;
$(input).change();
});
$('.modal-interest input[type=checkbox]').on('change', function () {
$('h1').html(this.checked ? 'tick it' : 'untick it');
});
答案 1 :(得分:1)
答案 2 :(得分:0)
应该使用prop方法。
input.prop('checked', false).change();
答案 3 :(得分:0)
试试这段代码:
$('.modal-interest').click(function () {
var input = $(this).find('input');
if (input.prop('checked')) {
input.prop('checked', false).change();
$('h1').html('untick it');
} else {
input.prop('checked', true).change();
$('h1').html('tick it');
}
});