Bootstrap Nav选项卡不适用于动态内容

时间:2018-05-08 23:42:37

标签: twitter-bootstrap

我尝试在标签中获取动态内容,但它不能按照预期的方式运行:

here is my codes

                                <div class="col-md-3">
<ul class="nav nav-tabs">
@foreach($faqs as $count => $faq)
<li role="presentation" @if($count == 0) class="active" @endif>
    <a href="#{{$faq->id}}" aria-controls="#{{ $faq->id }}" role="tab" data-toggle="tab">{{ $faq->title }}</a>
</li>
@endforeach
</ul>
                                </div><!--end col-3-->

                                <div class="col-md-9">
<div class="tab-content">
@foreach($faqs as $count => $faq)
<div @if($count == 0) class="tab-pane active" @else class="tab-pane" @endif id="{{$faq->id}}">
@foreach($faq->subfaqs as $subs)
<div class="panel-group" role="tablist" aria-multiselectable="true" id="#{{$subs->id}}">
    <div class="panel panel-default">
        <div class="panel-heading" role="tab">
            <h4 class="panel-title">
                <a href="#{{$subs->id}}" data-toggle="collapse"><i class="fa-icon fa fa-arrow-circle-o-up"></i>{{$subs->title}}</a>
            </h4>
        </div>

        <div id="{{$subs->id}}" class="panel-collapse collapse" role="tabpanel">
            <div class="panel-body">
                {!!$subs->body!!}
            </div>
        </div>
    </div>
</div>
@endforeach
</div>
@endforeach
</div>
                                </div><!--end col-9-->

和我的script

<script type="text/javascript">
  $('.collapse').collapse("show");
</script>

问题

  1. 我的标签<li>将无法加载(它始终加载我的第一个标签)
  2. 我的下拉列表collapse无法正常工作(无法打开/关闭它们)

0 个答案:

没有答案