загрузочная вкладка бутстрапа не работает после добавления вкладки

Я очень новичок в веб-дизайне и бутстрапе. Я пытаюсь создать заголовок с помощью вкладок .. и добавить выпадающее меню .. код выглядит так: ..загрузочная вкладка бутстрапа не работает после добавления вкладки

<body> 
    <div class="tabbable"> 
     <ul class="nav nav-tabs"> 
      <li class="active"><a href="#1" data-toggle="tab">Home</a></li> 
      <li class="dropdown"> 
       <a href="#2" class="dropdown-toogle" data-toggle="dropdown">Tentang Kami<span class="caret"></span></a> 
       <ul class="dropdown-menu"> 
        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action1</a></li> 
        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action2</a></li> 
        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action3</a></li> 
       </ul> 
      </li> 
      <li><a href="#3" data-toggle="tab">Contact Us</a></li> 
     </ul> 
     <div class="tab-content"> 
      <div class="tab-pane active" id="1"> 
       <iframe src="pages/home.html" width="1250" height="500" frameborder="0"></iframe> 
      </div> 
      <div class="tab-pane active" id="2"> 
       <iframe src="pages/sejarah.html" width="1250" height="500" frameborder="0"></iframe> 
      </div> 
      <div class="tab-pane active" id="3"> 
       <iframe src="pages/contactus.html" width="1250" height="500" frameborder="0"></iframe> 
      </div> 
      <div class="tab-pane active" id="4"> 
       <iframe src="pages/visimisi.html" width="1250" height="500" frameborder="0"></iframe> 
      </div> 
      <div class="tab-pane active" id="5"> 
       <iframe src="pages/progstudi.html" width="1250" height="500" frameborder="0"></iframe> 
      </div> 
     </div> 
    </div> 

    <script type="text/javascript"> 
     $(document).ready(function(){ 
      $(".tab-pane.active").hide(); // Hide all tab conten divs by default 
      $(".tab-pane.active:first").show(); // Show the first div of tab content by default 
     }); 
    </script> 
</body>

Так, вкладка «Tentang Ками» должен быть представлен dropdown..but, когда я пытаюсь его, выпадающий не покажет .. Но когда я пытаюсь пустой текст внутри <div class="tab-content"> , раскрывающиеся работы .. Я что-то упустил? Извините за мой плохой Английский

источник

2013-10-01 thekucays

первый укоротить JS на одну строку $ ("tab-pane.active. ") Нет (": первый") скрыть() -.. у вас есть страница или js скрипка, а css, самое главное, –

Ваше выпадающее меню не работает, потому что у вас есть href="#2", где id="2" существует. Выпадающий плагин требует здесь недействительной цели. Изменить решение href="#2" на href="#" или добавить data-target="nonsense" к вашему рычагу переключения.

Причина плагин пытаются найти родителей по:

function getParent($this) { 
    var selector = $this.attr('data-target') 

    if (!selector) { 
     selector = $this.attr('href') 
     selector = selector && /#/.test(selector) && selector.replace(/.*(?=#[^\s]*$)/, '') //strip for ie7 
    } 

    var $parent = selector && $(selector) 

    return $parent && $parent.length ? $parent : $this.parent() 
    }

Когда нет данных-мишень в вашем якорем (что делает смысле) HREF будет тест. Когда этот атрибут выходит, он имеет длину, и родительский элемент этого элемента будет возвращен в качестве родителя вашего выпадающего списка.

Поскольку href не требуется, Is href required on links? лучшее решение для добавления атрибута non href на якорь с data-toggle="dropdown".

Примечание вы определяете идентификаторы с номерами только, см: What are valid values for the id attribute in HTML?

источник

2013-10-01 20:10:27

Я изменил href = "# 2" на href = "#", и это сработало! Большое спасибо :) – thekucays

загрузочная вкладка бутстрапа не работает после добавления вкладки

ответ

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