Question

我正在尝试构造一个jquery语句，该语句将slideUp（）所有<ul>个元素，其兄弟节点不包含一组特定的类（.clicked，.chosen）。

假设我有以下嵌套<ul>结构：

<ul class="mainmenu">
    <li>Dogs</li>
    <ul>
        <li>Fido</li>
        <li class="chosen">Barney</li>
        <li>Turbo</li>
    </ul>
    <li>Cats</li>
    <ul>
        <li>Sylvester</li>
        <li>Felix</li>
        <li>Garfield</li>
    </ul>
    <li class="clicked">Hamsters</li>
    <ul>
        <li>Chubbs</li>
        <li>Oreo</li>
        <li>Ruby</li>
    </ul>
</ul>

对于上面的例子，我想slideUp（）只有'Cats'<ul>元素（'Sylvester'，'Felix'，'Garfield'），因为它的所有元素都不使用'selected'或'点击'类。

我当前的jquery语句为：

$('.mainmenu').first().siblings().not('.clicked, .chosen').slideUp();

这和我尝试过的其他一切都没有任何回报。建议？

Answer 1

你的HTML看起来很有挑战性:)但不知何故，我设法创建了一个查询来执行你正在寻找的东西。

如果您想检查特定元素的多个类，您也可以使用is()。

＆＃13;

//Check li doesn't have clicked class and then filter ul next to the li 
$('.mainmenu > li').not('.clicked').next('ul').filter(function(){
  //Find the ul, if it's any of li doesn't have chosen class 
  if(!$(this).find('li').hasClass('chosen'))
  {
    return $(this);
  }
}).slideUp();

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="mainmenu">
    <li>Dogs</li>
    <ul>
        <li>Fido</li>
        <li class="chosen">Barney</li>
        <li>Turbo</li>
    </ul>
    <li>Cats</li>
    <ul>
        <li>Sylvester</li>
        <li>Felix</li>
        <li>Garfield</li>
    </ul>
    <li class="clicked">Hamsters</li>
    <ul>
        <li>Chubbs</li>
        <li>Oreo</li>
        <li>Ruby</li>
    </ul>
</ul>

＆＃13;

使用jQuery上传多个<ul>元素

1 个答案: