選擇/取消選擇所有複選框在下一個塊元素中的複選框

我想取消選擇/選擇下面的每個基於「dept_checkbox」的dd.options中的所有內容。 Theres圍繞每個dd塊中的1到100多個複選框（我在第一個「dept_checkbox」部分放置了2個課程，並在下一個部分放置了這個片段）。選擇/取消選擇所有複選框在下一個塊元素中的複選框

<div class="accordion"> 
    <dt><input class="dept_checkbox" type="checkbox" onclick="selectAll($(this).parent().next(".options"))"><a href="">EYES|VISI</a></dt> 
    <dd class="options"> 
    <li> 
    <label> 
     <input type="checkbox" name="course_EYES|VISI" value="course_XXX">XXX 
    </label> 
    </li> 
    <li> 
    <label> 
     <input type="checkbox" name="course_EYES|VISI" value="course_YYY">YYY 
    </label> 
    </li> 
    </dd> 

    <dt><input class="dept_checkbox" type="checkbox" onclick="selectAll($(this).parent().next(".options"))"><a href="">EARS|HEAR</a></dt> 
    <dd class="options"> 
    <li> 
    <label> 
     <input type="checkbox" name="course_EARS|HEAR" value="course_EEE">EEE 
    </label> 
    </li> 
    </dd>  
</div>

我得到了以下很遠，但我不知道如何去做它，我試圖用jQuery來完成此任務。

function selectAll(pID){ 
    $('.'+pID).find(':checkbox').each(function(){ 
     *SELECT ALL CHECKBOXES IN OPTIONS SECTION FOR THIS PARENT* 
    });  
    }

我試圖遠離調用任何'名稱'或'值'值，因爲他們都改變。只有東西保持靜態（它們會顯示所有結果）是'dept_checkbox'，用於每個Select all複選框和'options'類，它們將保留前面的select/deselect all按鈕的複選框。

來源

2017-03-13 Daniel Plas Rivera

你到底要達到什麼樣的？ –

一個函數使一個複選框可以取消選擇/選擇下一個塊元素中的所有元素。可以通過任何「dept_checkbox」被用來完成該 –

全選（）{ /*選擇所有的複選框內的隨後的塊稱爲選項*/ }

基本上它會使所有這些「'CHECKBOX的」選擇/ DESE在執行它的父項的以下元素中引用 –

$('.dept_checkbox').click(function() { 
 
    if ($(this).is(':checked')) { 
 
    $(this).parent().next().find('input').prop('checked', true); 
 
    } else { 
 
    $(this).parent().next().find('input').prop('checked', false); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="accordion"> 
 
    <dt><input class="dept_checkbox" type="checkbox"><a href="">EYES|VISI</a></dt> 
 
    <dd class="options"> 
 
    <li> 
 
     <label> 
 
     <input type="checkbox" name="course_EYES|VISI" value="course_XXX">XXX 
 
    </label> 
 
    </li> 
 
    <li> 
 
     <label> 
 
     <input type="checkbox" name="course_EYES|VISI" value="course_YYY">YYY 
 
    </label> 
 
    </li> 
 
    </dd> 
 

 
    <dt><input class="dept_checkbox" type="checkbox"><a href="">EARS|HEAR</a></dt> 
 
    <dd class="options"> 
 
    <li> 
 
     <label> 
 
     <input type="checkbox" name="course_EARS|HEAR" value="course_EEE">EEE 
 
    </label> 
 
    </li> 
 
    </dd> 
 
</div>

來源

2017-03-13 23:52:19

嘗試類似$('.options').find(':checkbox ').prop({checked: true}) 這會找到選項中的每個複選框，並將'：checked'屬性設置爲true。

來源

2017-03-13 23:41:50

這裏，我們去：

checkCheckboxes = function(check){ 
 
$(".accordion input[type='checkbox']").prop('checked',check); 
 
} 
 

 
//Uncheck all the checkboxes 
 
checkCheckboxes(false); 
 
//Check all the checkboxes 
 
checkCheckboxes(true);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="accordion"> 
 
    <dt><input class="dept_checkbox" type="checkbox" onclick="selectAll($(this).parent().next(".options"))"><a href="">EYES|VISI</a></dt> 
 
    <dd class="options"> 
 
    <li> 
 
    <label> 
 
     <input type="checkbox" name="course_EYES|VISI" value="course_XXX">XXX 
 
    </label> 
 
    </li> 
 
    <li> 
 
    <label> 
 
     <input type="checkbox" name="course_EYES|VISI" value="course_YYY">YYY 
 
    </label> 
 
    </li> 
 
    </dd> 
 

 
    <dt><input class="dept_checkbox" type="checkbox" onclick="selectAll($(this).parent().next(".options"))"><a href="">EARS|HEAR</a></dt> 
 
    <dd class="options"> 
 
    <li> 
 
    <label> 
 
     <input type="checkbox" name="course_EARS|HEAR" value="course_EEE">EEE 
 
    </label> 
 
    </li> 
 
    </dd>  
 
</div>

來源

2017-03-13 23:44:20

選擇/取消選擇所有複選框在下一個塊元素中的複選框

回答

相關問題