jQuery применяет функциональность только к классу и родительским элементам

Question

У меня есть следующий список:

<ul>
<li class="topCurrent">One
    <ul>
        <li>One-1
            <ul>
                 <li>One-1.1
                     <ul>
                         <li class="current">One-1.1.1
                             <ul>
                                 <li>One-1.1.1.1</li>
                                 <li>One-1.1.1.2</li>
                                 <li>One-1.1.1.3</li>
                             </ul>
                         </li>
                         <li>One-1.1.2</li>
                     </ul>
                 </li>
                 <li>One-1.2</li>
            </ul>
        </li>
        <li>One-2</li>
        <li>One-3</li>
    </ul>
</li>
<li>Two
    <ul>
        <li>Two-1</li>
        <li>Two-2</li>
    </ul>
</li>

Использование следующего jQuery:

$("ul li ul").hide();

$("ul li").hoverIntent(
    function(){
        $(this).children('ul').slideDown('fast');
    },
    function(){
       $(this).children('ul').slideUp('fast');
    }
);

Это скрывает все ul под верхним уровнем ul до тех пор, пока над ним не наведется курсор.

Я хотел бы сделать следующее:

Если у li есть class="current", я бы хотел, чтобы эта структура была открыта до точки, в которую попадет ток. Он по-прежнему позволял бы отображать ul под ним при наведении, как и любые другие ul, но ни в коем случае родители class="current" не будут скрыты.

Предложения? Эта проблема сводила меня с ума.

Спасибо!

Answer 1

Это должно быть все, что вам нужно:

$("ul li:not(:has(li.current))")
   .find("ul").hide().end() // Hide all other ULs
   .hoverIntent(
        function(){
            $(this).children('ul').slideDown('fast');
        },
        function(){
           $(this).children('ul').slideUp('fast');
        }
    );

Это предотвратит применение функции наведения к любому LI, который имеет li.current в качестве дочернего элемента.

Вот демонстрационная версия (для наглядности используйте hover вместо hoverIntent).

Answer 2

Просто измените ваш вызов hoverIntent на следующее:

$("ul li").hoverIntent(
    function(){
        $(this).children('ul').slideDown('fast');
    },
    function(){
       $(this).children('ul').not($('.current').parents()).slideUp('fast');
    }
);

P.S. Следует отметить, что мой ответ ссылается на ответ Ника Крэйвера , когда вы задавали этот вопрос раньше . P.P.S. Жаль, что мое время отладки было сокращено из-за того, что вы ссылаетесь на этот пост и не меняете имя класса.