bootstrap 2.0 tab mit dem data-toggle="tab" nicht erscheint auf der Navigationsleiste

ok, im mit Jquery (Rand -) version, bootstrap 2.0, und ich habe diesen code:

    <div id="leftcol">
    <div id="ppl" class="tabbable tabs-left">
        <ul id="tabppl">
        <li class="active"><a class="bl" href="#1" data-target="#1" data-toggle="tab"> 1<span class="arroright"> </span></a> </li>
        <li><a class="bl" href="#2" data-target="#2" data-toggle="tab"> 2<span class="arroright"> </span></a> </li>
        <li><a class="bl" href="#3" data-target="#3" data-toggle="tab"> 3 <span class="arroright"> </span></a> </li>
        <li><a class="bl" href="#4" data-target="#4" data-toggle="tab">  4<span class="arroright"> </span></a>  </li>
        <li><a class="bl" href="#5" data-target="#5" data-toggle="tab"> 5<span class="arroright"> </span></a></li>
        <li><a class="bl" href="#6" data-target="#6" data-toggle="tab"> 6<span class="arroright"> </span></a>  </li>
        <li><a class="bl" href="#7" data-target="#7" data-toggle="tab"> 7 <span class="arroright"> </span></a></li>
        <li><a class="bl" href="#8" data-target="#8" data-toggle="tab"> 8<span class="arroright"> </span></a>  </li>
        <li><a class="bl" href="#9" data-target="#9" data-toggle="tab">9 <span class="arroright"> </span></a> </li>
        </ul>
    </div><!-- ppl-->
</div><!--leftcol-->

Ich kenne die Theorie, und einen einfachen code, wie funktioniert dies nur, wenn ich "Daten-toggle="tab"" in jedem-einen - tag, aber die # - Richtung, die nicht auf der Navigationsleiste erscheint, es ändert sich nur der content, die url http://twitter.github.com/bootstrap/javascript.html#tabs nicht erklären, wie ein nav, aber mit den tabs. Ich brauche all diese Informationen auf der Navigationsleiste erscheint. Wie http://Your-url.com/#yourtabclicked

InformationsquelleAutor Ignacio Bustos | 2012-04-02

  1. 1

    Ich etwas gefunden, das funktioniert. Es macht alle URL-Arbeit mit der #ID-Zeiger.
    nur hinzufügen:

    $(function () {
  var activeTab = $('[href=' + location.hash + ']');
  activeTab && activeTab.tab('show');
});

    Und diesem anderen code angezeigt, das Tab geöffnet, auf der Navigationsleiste, wenn Sie auf ihn klicken:

    $('.nav a').on('shown', function (e) {
  window.location.hash = e.target.hash;
})

    meisten der code gefunden wurde, die in verschiedenen teilen dieser website.

    HINWEIS: Sie benötigen die neueste JQuery (mit dem eigentlichen 1.7.1 funktioniert).

    InformationsquelleAutor Ignacio Bustos

  2. 1

    Den Registerkarten ist standardmäßig eingestellt.e.preventDefault.

      $(function () {
    $('body').on('click.tab.data-api', '[data-toggle="tab"], [data-toggle="pill"]', function (e) {
      e.preventDefault()
      $(this).tab('show')
    })
  })

    Können Sie versuchen, deaktivieren Sie die Standardwerte durch:

    $('body').off('click.tab.data-api');

    zum Beispiel. 

      $(function () {

    $('body').off('click.tab.data-api');

    $('body').on('click.tab.data-api', '[data-toggle="tab"], [data-toggle="pill"]', function (e) {
         //notice the e.preventDefault() is missing now
         $(this).tab('show');
    })
  })

    Nicht testen, aber es sollte funktionieren.

    InformationsquelleAutor Pawel Dubiel

Schreibe einen Kommentar