我正在使用bootstrap Tab导航,我想在bootstrap breadcrumb中反映这个导航。我怎样才能实现它。这是我的类似代码:
<ul class="nav nav-tabs">
<li class="active">
<a data-toggle="tab" href="#">some text</a>
</li>
<li>
<a data-toggle="tab" href="#">some text1</a>
</li>
</ul>
<div class="tab-content">
<div role="tabpanel" class="tab-pane fade in active">
<!--some content here-->
</div>
<div role="tabpanel" class="tab-pane">
<!--some content here-->
</div>
</div>
我想在我的页面中添加一个面包屑,显示当前活动点击的导航,例如“Home / some text”,如果“some text”选项卡是活动的那个。我需要一些帮助才能实现这一目标。
这是jsfiddle的链接:jsFiddle
答案 0 :(得分:0)
这是非常基本的,但我猜这是你想要的想法
HTML
<ul class="nav nav-tabs">
<li class="active">
<a class="tab-link" data-toggle="tab" href="#" data-url="#/someUrl1">some text</a>
</li>
<li>
<a class="tab-link" data-toggle="tab" href="#" data-url="#/someUrl2">some text1</a>
</li>
</ul>
<ul class="breadcrumb pull-right">
<li>
<a href="#">Here</a>
</li>
<li>
<a href="#/someUrl1" class="active-breadcrumb">some text</a>
</li>
</ul>
<div class="tab-content">
<div role="tabpanel" class="tab-pane fade in active">
<!--some content here-->
</div>
<div role="tabpanel" class="tab-pane">
<!--some content here-->
</div>
</div>
JS
var activeBreadcrumb = $('.active-breadcrumb');
$('.nav').on('click', '.tab-link', function () {
var self = $(this);
activeBreadcrumb.attr('href', self.data('url'));
activeBreadcrumb.text(self.text());
});
答案 1 :(得分:0)
以下是我的回答,初始化现有java.lang.NullPointerException
at android.widget.GridView.fillSelection(GridView.java:461)
at android.widget.GridView.layoutChildren(GridView.java:1249)
at android.widget.AbsListView.onLayout(AbsListView.java:2563)
at android.view.View.layout(View.java:15762)
at android.view.ViewGroup.layout(ViewGroup.java:4867)
at android.widget.LinearLayout.setChildFrame(LinearLayout.java:1677)
at android.widget.LinearLayout.layoutVertical(LinearLayout.java:1531)
at android.widget.LinearLayout.onLayout(LinearLayout.java:1440)
at android.view.View.layout(View.java:15762)
at android.view.ViewGroup.layout(ViewGroup.java:4867)
.......
的{{1}}元素,并根据点击的.breadcrumb .set-text
链接的文字更改其文字。
.nav-tabs .active
.nav-tabs