所以我用这段代码做了一个合理的导航栏:
<nav>
<ul class="nav nav-tabs nav-justified">
<li class="active"><a href="#">Seite 1</a></li>
<li><a href="#">Seite 2</a></li>
<li><a href="#">Seite 3</a></li>
<li><a href="#">Seite 4</a></li>
<li><a href="#">Seite 5</a></li>
<li><a href="#">Seite 6</a></li>
</ul>
</nav>
还有这段js代码:
$(".nav ul li").on("click", function(){
$(".ul").find(".active").removeClass("active");
$(this).parent().addClass("active");
});
但是当我点击列表中的元素时,它们是灰色的,但周围没有这条线,有人知道如何解决吗? 最好的问候 Azoni
编辑:它应该看起来像左边的但看起来像右边的:http://imgur.com/a/2RSvJ
最佳答案
您正在尝试在具有类 .nav
的元素内选择一个 ul
,它本身就是 ul
。此外,您将类添加到错误的元素,li
的父元素是 ul
而不是 li
。此外,您可以直接将其从所有对象中删除,而不是首先找到唯一的事件对象。
即这样做:
$(".nav li").on("click", function(){
$(".nav li").removeClass("active");
$(this).addClass("active");
});
关于jquery - Bootstrap 对齐导航栏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40006822/