0

我正在尝试将我的假(但漂亮)复选框绑定到真实复选框。最初我可以选择所有这些,但我不能取消选择它们。控制台总是说:真的,不管我点击了多少次假复选框。

$('.checkbox').click(function(){
        if($(this).prev().prev().prop('checked')==true){
            $(this).prev().prev().prop('checked',false);
            console.log($(this).prev().prev().prop('checked'));
            $(this).removeClass('checkbox_checked');
            $(this).addClass('checkbox_clear');
        }
        else {
            $(this).prev().prev().prop('checked',true);
            console.log($(this).prev().prev().prop('checked'));
            $(this).removeClass('checkbox_clear');
            $(this).addClass('checkbox_checked');
            }
    });

任何想法表示赞赏。

PS:这里是html。

<input data-val="true" data-val-required="The isChecked field is required." id="5_1" name="options[1].isChecked" value="true" type="checkbox"> 

<input name="options[1].isChecked" value="false" type="hidden">       

<label class="checkbox" for="5_1">Spring</label>
4

1 回答 1

2

问题是 LABEL 将复选框设置为 true 或 false。您还将复选框的选中设置为真或假。你不必这样做!让浏览器做检查!它总是真实的,因为你正在使它成为真实的。

所有这些 prev() 东西看起来都很可怕。我个人只会使用id。

$(document).on("click","label.checkbox", function() {
    var label = $(this);
    var isChecked = !$("#" + label.attr("for")).prop("checked");  //does not get checked until after label is fully clicked, hence the !
    label.toggleClass("checked", isChecked);
});

JSFiddle:http: //jsfiddle.net/4ZKFS/

于 2013-09-20T07:21:24.520 回答