javascript - jQuery 在两个单独的 div 中按类名选择复选框

Question

我在这里创建了一个 fiddle :http://jsfiddle.net/393Yk/

我有两列，每一列基本上都有一个嵌套无序列表的副本，其中包含很多复选框。

当我选中和取消选中左侧栏中的复选框时，右侧栏中的相应复选框也应该选中和取消选中。

这个想法实际上是隐藏右侧的元素，直到它们在左侧被选中，这样右侧应该只显示被选中的内容(而不是所有元素)。

我一次执行此步骤，但在完成一次后让右侧的复选框选中或取消选中时遇到问题。

所以第一次它起作用，但在第一次之后，它就不起作用了。

处理检查和取消检查的代码在这里:

$('.mod-left .wf-check').attr('checked', false).change(function(){

    var sel = $(this).data("val");

    if( $(this).is(":checked") ){

        console.log("Checked " + sel);

        $('.mod-right input.wf-check-' + sel + '[type=checkbox]').attr('checked', true);

    } else {

        console.log("Unchecked " + sel);

        $('.mod-right input.wf-check-' + sel + '[type=checkbox]').attr('checked', false);

    }
});

谁能帮我选择复选框并按类名操作它们？

谢谢。

Answer 1

以下似乎有效(即不使用 jquery attr() 函数)。

if( $(this).is(":checked") ){
    $('.mod-right input.wf-check-' + sel + '[type=checkbox]')[0].checked = true;
} else {
    $('.mod-right input.wf-check-' + sel + '[type=checkbox]')[0].checked = false;
}

当然，编码为:

$('.mod-right input.wf-check-' + sel + '[type=checkbox]')[0].checked = $(this).is(':checked');