使用jQuery选择具有至少2个子元素的所有元素

Question

我需要选择所有.sortable <ul>元素，但是我只需要具有2个或更多子代的元素（ <li>元素）。

jQuery是否有某种方法可以选择具有至少2个<li>子元素的<ul>元素？ 谢谢！

在此示例中，此代码还将选择第一个<ul> ，实际上应将其忽略（因为它只有一个孩子）。

 $('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()

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

Answer 2

将.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 3

您可以这样尝试：

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