添加类,然后单击时删除类

时间:2015-09-01 04:33:08

标签: jquery

我有一个锚文本,当点击时将活动类添加到另一个类。我想在它有一个活动类时删除它,或者我再次单击锚文本。我怎样才能做到这一点?

HTML:

<a id="menu1" href="#menu">BUTTON</a>
<a class="mm-title">TITLE</a>

JAVASCRIPT:

 $(function(){
  $("#menu1").click(function(){
      $(this).addClass("active");
      $("a.mm-title").addClass("remove");
  });
 });

CSS:

.remove { display: none; }

尝试使用这个,但似乎在切换回非活动状态时出现问题。第二次点击没有做任何事情,但第三次回到正常

JAVASCRIPT:

$(function(){
  $("#menu1").click(function(){
      $(this).toggleClass("active");
      $("a.mm-title").toggleClass("remove");
  });
 });

2 个答案:

答案 0 :(得分:2)

试试这个

$(function(){
  $("#menu1").click(function(){
      $(this).toggleClass("active");
      $("a.mm-title").toggleClass("remove");
  });
 });

让我知道它是否有用

答案 1 :(得分:1)

试试这个例子

    <style type="text/css">
        .sector-active
        {
            color: green;
        }
    </style>
    <div class="container">
       <div class="main-sectors">
           <a href="#" class="sector-active">Name1</a>
           <a href="#" class="p-l-35">Name2</a>
           <a href="#" class="p-l-35">Name3</a>
           <a href="#" class="p-l-35">Name4</a>
           <a href="#" class="p-l-35">Name5</a>
       </div>
    </div>
   <script type="text/javascript" src="../library/jquery-3.2.1.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function()
        {
            $('a').click(function()
            {
                $(this).removeClass('p-1-35');
                $('a').removeClass('sector-active');
                $(this).addClass('sector-active');
            });
        });

    </script>

此代码将添加sector-active类来点击a标记 并从其他sector-active代码中删除a

如果您可以将sector-active课程添加到所有点击的a代码中,那么请评论以下行

// $('a').removeClass('sector-active');

这会对你有所帮助