时间戳

首页 > 解决方案 > 更改类 jQuery 没有删除类

javascript - 更改类 jQuery 没有删除类

问题描述

我阅读了关于这个（根据我的意见）简单的 js 突击队的所有其他主题。它即将更改无序列表中元素的类。

但它不起作用。

我正在我的本地主机上工作，我有 3 个文件。- index.php - 样式表-sidemenu.css - sidemenu.js

在我的 index.php 的标题中，我将重定向到 2 个文件（css 和 js 文件）。

这是我的 html:`

<nav>   
    <ul class="nav">
        <li class="active">
            <a href="#"><span class="text">Afwijking</span> </a>
        </li>
        <li>
            <a href="#"><span class="text">Algemeen</span> </a>
        </li>
        <li>
            <a href="#"><span class="text">Frequentie</span> </a>
        </li>
        <li>
            <a href="#"><span class="text">Inleen</span> </a>
        </li>
    </ul>
</nav>

这里

这在我的 js/菜单中的 js 中：

$('li').click(function(){

  $(this).addClass('active')
       .siblings()
       .removeClass('active');

});

这是我在 css/sidemenu.css 中的 css

li{
  height:50px; 
  position:relative;
  background: linear-gradient(#292929, #242424);
}
a {
  border-top: 1px solid rgba(255,255,255,0.1);
  border-bottom: 1px solid black;
  text-decoration:none;
  display:block;
  height:100%;
  width:100%;
  line-height:50px;
  color:#bbb;
  text-transform: uppercase;
  font-weight: bold;
  font-size:12px;
  font-family: Calabri, helvetica, arial;
  padding-left:10%;
  border-left:5px solid transparent;
  letter-spacing:1px;
  transition: all 0.3s linear;
}
.active a{
  color: #fcb600;
  border-left:5px solid #fcb600;
  background-color: #1B1B1B;
  outline:0;
}
li:not(.active):hover a{
  color: #eee;
  border-left: 5px solid #FCFCFC;
  background-color: #1B1B1B;
}

我的代码有什么问题？

标签： javascriptjqueryelement

解决方案

啊! 谢谢你。我将重点放在代码本身上。我完全忘了写 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

它是头部。我感谢大家的知识。

推荐阅读