1

PHPで生成されたチェックボックスのグループがあります：

<?php foreach($checkbox as $check) {?>
<input type = "checkbox" name="checkbox[]" class="<?php echo $check -> class ?>" value ="<?php echo $check -> value ?>" /><?php echo $check->value ?>
<?php } ?>

上記の PHP は、以下の HTML を生成します。

<input type="checkbox" name="checkbox[]" class="class1" value="Checkbox1" />Checkbox1
<input type="checkbox" name="checkbox[]" class="class1" value="Checkbox2" />Checkbox2
<input type="checkbox" name="checkbox[]" class="class1" value="Checkbox3" />Checkbox3

<input type="checkbox" name="checkbox[]" class="class2" value="Checkbox4" />Checkbox4
<input type="checkbox" name="checkbox[]" class="class2" value="Checkbox5" />Checkbox5
<input type="checkbox" name="checkbox[]" class="class2" value="Checkbox6" />Checkbox6

<input type="checkbox" name="checkbox[]" class="class3" value="Checkbox7" />Checkbox7
<input type="checkbox" name="checkbox[]" class="class3" value="Checkbox8" />Checkbox8

上記を説明するために、チェックボックスの 3 つのクラスがあり、それが必要です。

にチェックを入れると無効になり、チェックを外すとclass1有効に戻ります。チェックすると、他のすべてが無効になり、すでにチェックされている場合はチェックされたままになり、チェックされていない場合はチェックされます。class3class3class2class2class1

以下のスクリプトを使用して、これを実行しようとしました。

$('input[class*="class"]').click(function(){
    if($(this).is(':checked')){
        var classValue = $(this).attr('class');
        if(classValue == 'class1'){
            $('.class3').prop('disabled', true);
            $('.class3').prop('checked', false);
        }
        else if(classValue == 'class2'){

            $('.class2').not(':checked').prop('disabled', true);
            $('.class3').prop('disabled', true);
        }

        else if(classValue == 'class3'){

            $('.class1').prop('checked', false);
            $('.class2').prop('checked', false);
            $('.class1, .class2').prop('disabled', true);

        }

    }

})

しかし、うまくいきません。

4

3 に答える 3

1

私はあなたのコードを少し修正しました。

$('input[class*="class"]').click(function(){

var classValue = $(this).attr('class')
    ,isChecked = $(this).is(':checked');

if(classValue == 'class1'){ 
    if( !isChecked && $('.' + classValue + ':checked').length > 0 ) {
        return;
    }
    $('.class3').prop('disabled', isChecked ? true : false);
    $('.class3').prop('checked', isChecked ? false : null);
}
else if(classValue == 'class2'){
    if( isChecked && $('.class1 :checked').length <= 0 ){
        $('.class1').prop('checked', true);  
    }
     $('.class2').not(':checked').prop('disabled', isChecked ? true : false); 
    $('.class3').prop('disabled', isChecked ? true : false);
}
else if(classValue == 'class3'){

    $('.class1, .class2').prop('checked', isChecked ? false : null);
    $('.class1, .class2').prop('disabled', isChecked ? true  : false);   
}

}))

于 2013-09-02T16:21:21.627 に答える