: not () в разных обличьях не работает

Question

Я делаю простую навигационную систему jQuery, но я далеко не эксперт в этом, так как следующий код может демонтировать.

HTML:

  <ul id="main-nav"> 
        <li><a href="../" id="home">HOME</a></li> 
        <li class="pipe">|</li> 
        <li id="about">ABOUT US</li> 
        <li class="pipe">|</li> 
        <li id="projects">PROJECT TYPES</li> 
        <li class="pipe">|</li>             
        <li id="reducing">REDUCING EMISSIONS</li> 
        <li class="pipe">|</li> 
        <li id="carbon">CARBON MARKETS</li> 
        <li class="pipe">|</li> 
        <li id="FAQs">FAQs</li> 
    </ul> 

jQuery:

 $(function () {
        $("#main-nav li:not('.pipe')").hover(function () {
            var $this = $(this).attr("id");
            $('#nav-strip2 ul.sub-nav').hide();
            $("#nav-" + $this).show();
        });
    });

Показ / скрытие работает просто отлично, единственная проблема - когда труба накрыта, она скрывает все.Есть причина, по которой меню должно быть составлено за <li> с и не может быть просто <a> с, но оно не очень актуально и долго.

Я пытаюсь здесь исключить .hover () что-то происходит, когда это класс с .pipe, но радости нет.Что я делаю неправильно?Любая помощь приветствуется.Я уверен, что есть способ исключить <li> s без прикрепленного идентификатора, который бы сохранил назначение класса .pipe всем этим <li> s.Увы, у меня пока нет способности jQuery это выяснить!

Спасибо.

Answer 1

При использовании :not() в качестве селектора не используйте кавычки в его скобках:

$("#main-nav li:not(.pipe)")

Answer 2

попробуйте это:

$(function () {
    $("#main-nav li").not('.pipe').mouseenter(function () {
        $('#nav-strip2 ul.sub-nav').hide();
        $("#nav-" + this.id).show();
    });
});