javascript - 单击另一个链接后删除链接组的类别

Question

这些链接组是我的导航元素。一旦单击链接，var make_button_active 就会删除并插入事件类。使用 CSS，类 active 为链接文本指定橙色。我有另一个链接，该链接不在该组内。它是一个 Logo 链接，可转到#home。我希望一旦单击此按钮，事件类就会从 ul.menu 内的链接中删除。这样，当单击 #home 时，导航元素就不会保持橙色。我单独尝试过，但我是 javascript 的初学者。

你能帮我完成这个任务吗？

HTML:

<nav>
    <div id="logo">
        <a href="#home" class="panel"><img src="_img/logo.png" alt="DR logo" /></a>
    </div>
    <div id="categories">
        <ul class="menu">
                <li><a href="#aboutMe">ABOUT ME</a></li>
                <li><a href="#showcase">SHOWCASE</a></li>
                    <li><a href="#howWork">HOW DO I WORK</a></li>
            <li><a href="#meet">LETS MEET</a></li>  
        </ul>
    </div>
    <hr>
</nav>

CSS:

.menu li.active a {
     color: #ff530d;
}​

JQUERY:

<script type="text/javascript"> 
         var make_button_active = function()
           {
              //Get item siblings
              var siblings =($(this).siblings());
              //Remove active class on all buttons
              siblings.each(function (index)
                {
                  $(this).removeClass('active');
                }
              );

              //Add the clicked button class
              $(this).addClass('active');
            }

        var classOut = function()
            {
                $(".menu li").removeClass('active');
            }


             $(document).ready(function() {
            $(".menu li").click(make_button_active);

            $("#home").click(classOut);
        });
        </script>

Answer 1

我重写了你的整个 JavaScript，this有帮助吗？

我将你的 JavaScript 更改为:

$(document).ready(function()
{

  $('.menu a').click(function(e)
  {
    e.preventDefault();
    $('.menu a').removeClass('active');
    $(this).addClass('active');        
  });

  $('#logo > a').click(function(e)
  {
    e.preventDefault();
    $('.menu a').removeClass('active');        
  });    

});

​