Question

我有一个包含多个部分的页面，每个部分都有一个相应的复选框。当选中一个复选框时，我想突出显示包含div（并逐渐消失颜色）。取消选中复选框后，不应该有突出显示。我有两个问题：让jQuery突出显示div的最佳方法是什么？如何在仅选中复选框时触发突出显示，而不是取消选择？

由于

Answer 1

没有必要重新发明轮子，因此对于高光效果，请使用http://docs.jquery.com/UI/Effects/Highlight（这将使您的生活更轻松）。

要检查复选框的状态，请使用.prop()，但.is(':checked')也有效。

JAVASCRIPT：

$(document).ready(function(){
    $('input[name="checkbox"]').click(function(){
        if($(this).prop('checked'))
           $('div').eq($(this).parent().index()).effect("highlight", {}, 1000); 
    });
});

样本： http://jsfiddle.net/dirtyd77/gmPtY/2/

Answer 2

类似的东西：

$(':checkbox').click(function() {
    if ($(this).is(':checked')) {
        $(this).closest('.parent-class').addClass('highlight');
    }
}

选中复选框时，jQuery突出显示div

2 个答案: