我有一个链接到同一个html页面的导航栏。我想要实现的是点击导航栏的字母。我们可以直接扩大这封信。例如,通过单击A,我们将被重定向到A并且字母将被展开。
以下是代码:
`<nav class="navbar navbar-default" style="background-color: #F8F8F8;">
<div class="container">
<div class="btn-toolbar">
<div class="btn-group btn-group-sm">
<a href="#0"><button class="btn btn-default">0-9</button></a>
<a href="#A"><button class="btn btn-default">A</button></a>
<a href="#B"><button class="btn btn-default">B</button></a>
<a href="#C"><button class="btn btn-default">C</button></a>
<a href="#D"><button class="btn btn-default">D</button></a>
<a href="#E"><button class="btn btn-default">E</button></a>
</div>
</div>
</div>
</nav>
<div class="panel-group" name="#0" id="#0">
<div class="panel panel-default">
<div class="panel-heading" style="background: none;">
<h3 class="panel-title">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#0" href="#0">
<strong>0-9</strong>
</h3>
</div>
<div id="#0" name="#0"class="panel-collapse collapse">
<div class="panel-body">
<hr style="height:2px;border:none;color:#333;background-color:#333;"/>
</div>
</div>
</a>
<div class="panel-group" id="#0">
<div class="panel panel-default">
<div class="panel-heading" style="background: none;">
<h3 class="panel-title">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#A">
<strong>A</strong>
</h3>
</div>
<div id="A" class="panel-collapse collapse">
<div class="panel-body">
<hr style="height:2px;border:none;color:#333;background-color:#333;" />
</div></a>
</div>
`
答案 0 :(得分:0)
您可以将点击后添加到href,最终会将类添加到相应的字母 A ,并将从所有其他字母中删除类。 更好的方法是首先从所有删除然后添加到相应的一个。 现在当你有** href ='#A'时这会有效,因为在向网址添加#A时你没有重定向到任何网页**。它只是用内容指向内容并向上滚动到那个。
对于第二种情况,如果您需要重定向到任何其他网址,并且只有少量固定数量的网址。更简单的方法是创建URL到相应字母的地图以扩展,并使用JavaScript简单地应用类。 现在,如果不仅仅修改了多个网址,如果您正在进行整页重新加载,请执行此服务器端,否则上面提到的点击 第一个技巧将起作用。 希望它会有所帮助。 快乐编码。