如何获取特定 ul 的选中复选框

Question

我正在创建一个动态 ul 并尝试仅获取特定 ul 的复选框。

$(document).on("click", "input:checkbox[name=filter]:checked", function() {
  var flags = Array();
  $("input:checkbox[name=filter]:checked").each(function() {
    flags.push($(this).val());
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="dropdown-list">
  <li><input type="checkbox" name="filter" value="form">Form</li>
  <li><input type="checkbox" name="filter" value="anonymise">Anonymise</li>
  <li><input type="checkbox" name="filter" value="priority">Priority</li>
  <li><input type="checkbox" name="filter" value="question">Question</li>
</ul>
<ul class="dropdown-list">
  <li><input type="checkbox" name="filter" value="form">Form</li>
  <li><input type="checkbox" name="filter" value="anonymise">Anonymise</li>
  <li><input type="checkbox" name="filter" value="priority">Priority</li>
  <li><input type="checkbox" name="filter" value="question">Question</li>
</ul>
<ul class="dropdown-list">
  <li><input type="checkbox" name="filter" value="form">Form</li>
  <li><input type="checkbox" name="filter" value="anonymise">Anonymise</li>
  <li><input type="checkbox" name="filter" value="priority">Priority</li>
  <li><input type="checkbox" name="filter" value="question">Question</li>
</ul>

所有三个UL都是相同的，在这种情况下，我如何才能获得特定 ul 的所有复选框。

这给了我来自所有 ul 的所有选中的复选框。

Answer 1

我猜你只想要包含该单击元素的 ul 。尝试这个：

$(document).on("click", "input:checkbox[name=filter]:checked", function(){
    var flags = Array();
    $("input:checkbox[name=filter]:checked", $(this).parents("ul").first()).each(function(){
        flags.push($(this).val());
    });
    console.log(flags);
});

内部函数前面each有一个作用域标识符。$(this).parents("ul").first()这将按单击输入的容器过滤输入。