2013-05-14 2 views
0

Сейчас я работаю с начальной загрузки, я хочу добавить вкладку Twitter Bootstrap, я добавил JQuery и Bootstrap-tabs.jsзагрузочные вкладки работают, но данные не отображаются?

Я добавил следующий скрипт:

<script> 
    $('#myTab a').click(function (e) { 
    e.preventDefault(); 
    $(this).tab('show'); 
    }); 
</script> 

и я использую следующий код для добавления закладки:

<div class="span12" id="stafftabs" style="margin-bottom: 20px;display:none;"> 
<ul id="myTab" class="nav nav-tabs"> 
    <li class="active"> 
    <a href="#home" data-toggle="tab">Home</a> 
    </li> 
    <li> 
    <a href="#profile" data-toggle="tab">Profile</a> 
    </li> 
    <li class="dropdown"> 
    <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a> 
    <ul class="dropdown-menu"> 
    <li> 
    <a href="#dropdown1" data-toggle="tab">@fat</a> 
    </li> 
    <li> 
    <a href="#dropdown2" data-toggle="tab">@mdo</a> 
    </li> 
    </ul> 
    </li> 
</ul> 
<div id="myTabContent" class="tab-content"> 
    <div class="tab-pane fade in active" id="home"> 
    <p>Raw</p> 
    </div> 
    <div class="tab-pane fade" id="profile"> 
    <p>Food</p> 
    </div> 
    <div class="tab-pane fade" id="dropdown1"> 
    <p>Etsy</p> 
    </div> 
    <div class="tab-pane fade" id="dropdown2"> 
    <p>Trust</p> 
    </div> 
</div> 
</div> 
</div> 

Я получаю вкладки, чтобы работать должным образом, но никакие данные не показываются в закладках,

, пожалуйста, помогите мне, ребята, выйти из этой проблемы?

+0

и есть дополнительный закрывающий DIV в разметке – Subash

+0

Разве не из-за 'дисплей: нет;' в вашей родительской DIV? Если нет, можете ли вы воссоздать с помощью jsfiddle? – Morpheus

+0

Эй, все в порядке, когда я вижу это в jsfiddle, но я использую тему начальной загрузки Supr, возможно, есть некоторые конфликты, я не могу разрешить это :( –

ответ

0

Здесь у вас есть jsFiddle, работающий без использования JS. Легко кодифицировать, проще и быстрее.

Вам нужно использовать только class="tabbable"

Смежные вопросы