基础：使用复选框来隐藏/显示div

我试图在页面顶部使用带有类别的复选框作为过滤器来显示页面的较低内容（这给出了每个类别下按钮的具体选项）。只有当复选框被选中时，才会显示降低的div值;我为CSS中的div设置显示为none。然而，我的代码不起作用..基础：使用复选框来隐藏/显示div

我试过使用不同语法的JS，我在网上找到，并在我的HTML中的不同地方声明js，但迄今为止没有工作。

HTML

<input type="checkbox" id="supportcheck"> Support 

<div class="row" id= "support"> 
<h5>Support</h5> 
<div class="large-6 medium-6 columns"> 
<div class="callout panel" > 
<div role="button" tabindex="0" class="small radius support button">Managed</div> 
</div> 
</div> 

<div class="large-6 medium-6 columns"> 
<div class="callout panel"> 
<div role="button" tabindex="0" class="small radius support button">Self-Managed</div> 
</div> 
</div> 
</div>

的JavaScript

$('.supportcheck').change(function() { 
    if ($(this).attr("checked")) 
    { 
     $('.support').fadeIn(); 
     return; 
    } 
    $('.support').fadeOut(); 
});

来源

2015-06-05 nicole

请参阅（http://meta.stackexchange.com/questions/19190/should-questions-include [56， “问题包括‘标签’，在他们的头衔？”]标题），其中的共识是“不，他们不应该”！ –

supportcheck是一个ID不是一类。使用

$('#supportcheck').change(function() {

将事件处理程序添加到输入。

来源

2015-06-05 17:26:20 Barry

试试这个：

$('#supportcheck').change(function() { 

    if ($(this).is(':checked')) 
    { 
     $('#support').fadeIn(); 
     return; 
    } 
    $('#support').fadeOut(); 
});

来源

2015-06-05 17:26:36 NepCoder

基础：使用复选框来隐藏/显示div

回答

相关问题