javascript - jquery循环遍历输入字段并进入父级和兄弟级

Question

大家好，我遇到了一些代码问题，希望能得到帮助。我的 html 设置如下:

     <div class="menu_options">
           <div class="parent_options">
               <input type="checkbox" class="parent_required" />
           </div>
           <div class="children">
                 <div class="child_options">
                      <input type="checkbox" class="child_required" />   
                 </div>
                 <div class="child_options">
                      <input type="checkbox" class="child_required" />   
                 </div>
                 <div class="child_options">
                      <input type="checkbox" class="child_required" />   
                 </div>
           </div>
      </div>

基本上我想做的是在 jquery 中，如果 parent_required 类复选框被选中，则获取子类下的所有输入字段和 child_required 类的所有输入字段取消选中它们。

我不能在输入字段上使用 id'，因为我不知道要使用的字段的所有 id。

到目前为止，在 jquery 中我有这段代码

      $('.parent_required').click(function() {

            if(!$(this).is(":checked")) {
                var child = $(this).parent('.parent_options').siblings('.children');

            }
        });

我在 div class='children part 不知道如何深入。

Answer 1

试试这个:

$('.parent_required').click(function() {
    if (!$(this).is(":checked")) {
        $(this).closest('.parent_options')
            .siblings('.children')
            .find('.child_required')
            .prop('checked', false);
    }
});

Example fiddle