代码之家 › 专栏 › 技术社区 › streetparade

多个复选框,如果都在Jquery中选中

jquery

streetparade · 技术社区 · 16 年前

我有六个复选框。

Checkbox1 <input type="checkbox" id="check1">

Checkbox2 <input type="checkbox" id="check2">

<div id="checkbox1field" {if $blabla} style="display="none"{/if}> 
Checkbox1 <input type="checkbox" id="check3">
Checkbox2 <input type="checkbox" id="check4">
</div>

<div id="checkbox2field" {if $blabla2} style="display="none"{/if}>
Checkbox1 <input type="checkbox" id="check5">
Checkbox2 <input type="checkbox" id="check6">
</div>

现在如果我点击复选框 id=check1 id=checkbox1field 如果其 display="none" .

如果我点击 id="check3" 这个 id="check4"

如果我点击这个 id=“支票3” 应该藏起来。

id="checkbox2field" .

id="check2" and id="check1"

那我两个都要 id=“复选框2字段” 和 id="checkbox1field" 应该显示。

我所做的50%有效的就是这里

$("#check1:checked").show("fast").("#check4").show("fast").("#checkbox2field").hide("fast");
$("#check2:checked").show("fast").("#check1").hide("fast").("#checkbox1field").show("fast");

如何使用jquery解决这个问题?

2 回复 | 直到 16 年前

Matt user129975 16 年前

$('#check1,#check2').bind('change', function () {
    var self = $(this);

    $('#' + self.attr('id') + 'field').toggle(self.attr('checked')).children(':checkbox').show();
});

$('#check3,#check4,#check5,#check6').bind('change', function () {
    var self = $(this);

    self.siblings(':checkbox').toggle(self.attr('checked'));
});

您可能希望将类应用于您的复选框,以使选择更容易。

VoteyDisciple 16 年前

试图在一个庞大的jQuery链中完成这一切注定会让人更加困惑。

下面是一个简单、直接的方法:

if ($('#check1').is(':checked')) {
    if ($('#check2').is(':checked')) {
        $('#checkbox1field').show('fast');
        $('#checkbox2field').show('fast');
    } else {
        $('#checkbox1field').hide('fast');
    }
} else if ($('#check2').is(':checked')) {
    $('#checkbox2field').hide('fast');
}

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

1 年前

Dr.0000FF · jQuery按钮点击不显示/隐藏内容

1 年前

user28928120 · 如何在jquery中选择所有类?

1 年前

LauraNMS · 如何使用Waypoints js实现粘性元素和偏移量

1 年前