使用 jQuery 到 select 所有至少有 2 children 的元素

Question

我需要 select 所有 .sortable <ul> 元素，但我只需要那些有 2 个或更多 children (<li> 元素).

有没有办法让 jQuery 仅 select <ul> 个元素至少有 2 <li> children？谢谢！

此代码也会 select 本例中的第一个 <ul>，实际上应该忽略它（因为它只有 1 个 child）。

$('ul.sortable:has(li)').sortable({
  axis: 'y',
  placeholder: 'list-group-item holder list-group-item-warning'
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul class="list list-group mb-4 sortable">
  <li class="list-group-item" data-id="2">Amarillo</li>
</ul>
<ul class="list list-group mb-4 sortable">
  <li class="list-group-item" data-id="1">Azul</li>
  <li class="list-group-item" data-id="3">Rojo</li>
</ul>
<ul class="list list-group mb-4 sortable">
  <li class="list-group-item" data-id="9">Verde</li>
  <li class="list-group-item" data-id="8">Cafe</li>
  <li class="list-group-item" data-id="6">Naranja</li>
  <li class="list-group-item" data-id="7">Rosado</li>
</ul>

Answer 1

将.filter与回调函数一起使用：

const uls = $('ul.sortable:has(li)')
  .filter(function() {
    return $(this).children('li').length >= 2;
  });
console.log(uls.length);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul class="list list-group mb-4 sortable">
    <li class="list-group-item" data-id="2">Amarillo</li>
</ul>
<ul class="list list-group mb-4 sortable">
    <li class="list-group-item" data-id="1">Azul</li>
    <li class="list-group-item" data-id="3">Rojo</li>
</ul>
<ul class="list list-group mb-4 sortable">
    <li class="list-group-item" data-id="9">Verde</li>
    <li class="list-group-item" data-id="8">Cafe</li>
    <li class="list-group-item" data-id="6">Naranja</li>
    <li class="list-group-item" data-id="7">Rosado</li>
</ul>

Answer 2

使用filter()

$('ul.sortable').filter(function(){
   return $(this).children().length > 1;
}).sortable({
    axis: 'y',
    placeholder: 'list-group-item holder list-group-item-warning'
});

Answer 3

你可以这样试试：

$('.sortable li+li').parent()

使用 jQuery 到 select 所有至少有 2 children 的元素

Using jQuery to select all elements that have at least 2 children

javascript

jquery

dom

jquery-ui