使用複選框和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切換在下拉框中隱藏特定值

回答

相關問題