选中另一个复选框时,选中一些复选框

时间:2013-12-19 11:32:20

标签: jquery html

当我检查opt1时,我尝试检查带有id check1和check2的两个复选框,我使用jquery,这是以下代码。     jquery是:

$(document).ready(function() {
    $('#opt1').change(function() {
        if(this.checked) {
            $('#raw').slideDown(400);
            $('#check1').changeAttr('checked');
            $('#check2').prop('checked', true);
        } else {
            $('#raw').slideUp(200)
        }
    });
});

这是我的HTML代码

<dl>
                                            <dt><input id="opt1" type="checkbox" name="vehicle" value="Raw Material">Raw Material</dt>
                                                <div id="raw" class="option" style="display:none">
                                                </br><dd><input id="check1" type="checkbox" name="lol[]" value="Add Raw Name">Add Raw Name</dd><br/>
                                                <dd><input id="check2" type="checkbox" name="lol[]" value="View Raw Materials">View Raw Materials</dd>
                                                </div>
                                            </dl>

3 个答案:

答案 0 :(得分:2)

您需要将值传递给prop()方法以及要设置的属性。

$('#check1').prop('checked', true);

http://jsfiddle.net/K63mF/

答案 1 :(得分:1)

如果要在选中第一个复选框时选中其他2个复选框,则可以这样做:

(Shown in this fiddle)

$(document).ready(function() {
    $('#opt1').change(function() {
        if($(this).is(":checked")) {
            $('#check1').prop('checked', 'checked');
            $('#check2').prop('checked', 'checked');
        } else {
            $('#check1').prop('checked', '');
            $('#check2').prop('checked', '');
        }
    });
});

答案 2 :(得分:0)

使用以下代码

$(document).ready(function() {
    $('#opt1').change(function() {
        if(this.checked) {

            $('#raw').slideDown(400);

            //update code
            $('#check1').attr('checked','checked');
            $('#check2').attr('checked','checked');

        } else {
            $('#raw').slideUp(200);

            //if you want to remove check
            //$('#check1').removeAttr('checked');
            //$('#check2').removeAttr('checked');
        }
    });
});