使用复选框和jQuery切换在下拉框中隐藏特定值

我有一个下拉框填充了从数据库中拉出的选项。这些选项中的每一个都将具有“Y”或“N”的活动指标值。我有一个复选框，其中将包括所有选项或只是活动的选项。使用复选框和jQuery切换在下拉框中隐藏特定值

我目前有选择从数据库完美拉。输入选项的for循环如下所示：

for ($i = 0; $i < count($category_record); $i++) { 
if($category_record[$i]->getActiveInd() == "Y") 
       { 
    echo '<option value="'.$category_record[$i]->getId().'" '.$checked.' >&nbsp;&nbsp; - '.$category_record[$i]->getTitle().'</option>';  
       } 
else if($category_record[$i]->getActiveInd() == "N") 
       { 
    echo '<option id="inactive" value="'.$category_record[$i]->getId().'" '.$checked.' >&nbsp;&nbsp; - '.$category_record[$i]->getTitle().'</option>';  
       }

因此，如果该值为非活动值，那么该选项的ID将为'#inactive'。

复选框很简单：

<input type="checkbox" name="search_active" id="checkbox" />

jQuery的我，此刻看起来是这样的：

$(document).ready(function() { 
$('input[type=checkbox]').click(function(){ 
    var $this = $(this); 
    if($this.is(':checked')) 
    { 
     $('#inactive').show(); 
    } 
    else 
    { 
     $('#inactive').hide(); 
    } 
}); 
});

此代码的工作，咯，因为它会隐藏不活动的值当复选框未被选中时，它将只隐藏它遇到的第一个值，而不是全部。我检查了元素，他们都仍然有#inactive id，但他们不会隐藏。我寻找答案，但一直没能找到答案，我做错了什么？

来源

2013-11-27 Craig Jones

多次，不要使用相同的ID在同一页上！使用类。阅读：http://www.tizag.com/cssT/cssid.php –

对于多个元素，您应该使用类.active,.inactive或创建您自己的属性，如状态。

PHP：

for ($i = 0; $i < count($category_record); $i++) { 
if($category_record[$i]->getActiveInd() == "Y") 
       { 
    echo '<option value="'.$category_record[$i]->getId().'" '.$checked.' >&nbsp;&nbsp; - '.$category_record[$i]->getTitle().'</option>';  
       } 
else if($category_record[$i]->getActiveInd() == "N") 
       { 
    echo '<option class="inactive" value="'.$category_record[$i]->getId().'" '.$checked.' >&nbsp;&nbsp; - '.$category_record[$i]->getTitle().'</option>';  
       }

JS：

$(document).ready(function() { 
$('input[type=checkbox]').click(function(){ 
    var $this = $(this); 
    if($this.is(':checked')) 
    { 
     $('.inactive').show(); 
    } 
    else 
    { 
     $('.inactive').hide(); 
    } 
}); 
});

来源

2013-11-27 12:16:56

这很漂亮。非常感谢。我不敢相信这是一件小事。你不仅给了我正确的答案，还向我展示了班级和身份证的区别！ –

没问题。乐意效劳。祝你的项目好运。 –

对下拉菜单中的选项使用class'inactive'，而不是id。并修改你的js使用class来show（）和hide（）。

来源

2013-11-27 12:13:41 dev

使用复选框和jQuery切换在下拉框中隐藏特定值

回答

相关问题