如何在jquery中选中复选框中获取父节点的ID？

Question

如何在jquery中选中复选框上获取父节点(Collapse1)的ID。

   <div id="collapse1" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="heading1" 
   style="height: auto;">
  <div class="panel-body">
         <div class="checkbox">
          <label>
        <input type="checkbox" class="option-input checkbox" name="filter[]" value="1" checked="checked"> <span class="ml-10">Core i5 (25)</span>

             </label>
    </div>
            <div class="checkbox">
           <label>         
         <input type="checkbox" class="option-input checkbox" name="filter[]" value="2"> <span 
         class="ml-10">Core i7 (18)</span>
           </label>
    </div>

  </div>
</div>

我尝试了下面的代码，但无法获得

var pid = this.parentNode.id;

Answer 1

为此，可以使用复选框:checked属性：

$('input[type=checkbox]:checked').closest('.panel-collapse').attr('id');

工作片段：

​

console.log($('input[type=checkbox]:checked').closest('.panel-collapse').attr('id'));

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="collapse1" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="heading1" 
   style="height: auto;">
  <div class="panel-body">
         <div class="checkbox">
          <label>
        <input type="checkbox" class="option-input checkbox" name="filter[]" value="1" checked="checked"> <span class="ml-10">Core i5 (25)</span>

             </label>
    </div>
            <div class="checkbox">
           <label>         
         <input type="checkbox" class="option-input checkbox" name="filter[]" value="2"> <span 
         class="ml-10">Core i7 (18)</span>
           </label>
    </div>

  </div>
</div>

​

注意:由于我无法在您的问题代码中看到与this相关的内容，所以我给您提供了上面的解决方案。

如果this相关的东西可用(正如您所说的)，那么您可以直接使用@Swati代码：

$(this).closest('.panel-collapse').attr('id')