Question

我有一个动态表格，其中包含可能会或可能不会被选中的复选框。我编写了一个jquery脚本，只要修改了一个复选框，它就会改变它所在的表格单元格的bg颜色;然而，这是非常错误的，并不总是立即改变BG颜色。

有什么建议吗？

var check;

$('[id^=approvalcd]').change(function(){
if($(this).is(":checked") != check) { 
     check = $(this).prop("checked");
     $('.approvalROW'+$(this).prop('id').split('approvalcd')[1]).css('background-color', color);
}else{
     $('.approvalROW'+$(this).prop('id').split('approvalcd')[1]).css('background-color', 'inherit');
}
});

HTML：

<td class='approvalROW" . $counter . "'>
<input id='approvalcd" . $counter ."' name='ApprovalCd" . $counter . "' type='checkbox'></td>

Answer 1

我建议，尽管未经测试：

$('table td input[type="checkbox""]').change(function(){
    $(this).closest('td').css('background-color', this.checked ? 'color' : 'inherit');
});

Answer 2

我认为使用类更灵活：

$('table').on('change', ':checkbox', function() {
    $(this).closest('tr').toggleClass('selected', this.checked);
})
.find(':checkbox').trigger('change');

例如：http://jsfiddle.net/hkL43/1/

Answer 3

我会改变你如何找到表格行元素。使用...

$(this).parents('tr').css('background-color', color);

我不知道您的HTML，但这可能会提供更一致的结果。

在更改时检查动态复选框

3 个答案: