引導選項卡不上點擊使用jQuery切換

Question

http://bootply.com/107403

的JS

<script type="text/javascript"> 
    $('.stat-wrap a').click(function (e) { 
     e.preventDefault() 
     $(this).tab('show') 
    }) 
</script> 

我已經正確連接到ID綁定，但一切都只是出現了，沒有什麼工作。奮鬥了1個多小時，但沒有解決。幫幫我。

Answer 1

這裏是你的代碼工作的例子：http://bootply.com/107407

的數據切換=「標籤」屬性必須在錨，而不是股利。

<a href="#note-tab" data-toggle="tab"> 
     <div class="active"> 
      <div class="col-md-3 stat-text-wrap active"> 
       <p class="stat-number-desc">PRIVATE NOTES</p> 
      </div> 
     </div> 
    </a> 

    <a href="#quotes-tab" data-toggle="tab"> 
     <div> 
      <div class="col-md-3 stat-text-wrap"> 
       <p class="stat-number-desc">QUOTES</p> 
      </div> 
     </div> 
    </a> 

    <a href="#project-tab" data-toggle="tab"> 
     <div> 
      <div class="col-md-3 stat-text-wrap"> 
       <p class="stat-number-desc">PROJECTS DONE</p> 
      </div> 
     </div> 
    </a> 

    <a href="#skill-tab" data-toggle="tab"> 
     <div> 
      <div class="col-md-3 stat-text-wrap"> 
       <p class="stat-number-desc">NEW SKILLS</p> 
      </div> 
     </div> 
    </a> 

此外，標籤內容需要用類「tab-content」包裝在容器中。

<div class="tab-content"> 
    <div class="tab-pane active" id="note-tab"> 
     <input placeholder="NOTE What's on your mind?" class="status-input" type="text"> 
    </div> 

    <div class="tab-pane" id="quotes-tab"> 
     <input placeholder="QUOTE What's on your mind?" class="status-input" type="text"> 
    </div> 

    <div class="tab-pane" id="project-tab"> 
     <input placeholder="PROJECTWhat's on your mind?" class="status-input" type="text"> 
    </div> 

    <div class="tab-pane" id="skill-tab"> 
     <input placeholder="SKILLWhat's on your mind?" class="status-input" type="text"> 
    </div> 
</div> 

Answer 2

你應該使用data-toggle="tab"與錨標記即<a href="#note-tab">這樣」 <a href="#note-tab" data-toggle="tab">

其次包裹你的標籤內容.tab-content這樣的：

<div class="tab-content"> 
<div class="tab-pane active" id="note-tab"> 
    <input placeholder="NOTE What's on your mind?" class="status-input" type="text"> 
</div> 

<div class="tab-pane" id="quotes-tab"> 
    <input placeholder="QUOTE What's on your mind?" class="status-input" type="text"> 
</div> 

<div class="tab-pane" id="project-tab"> 
    <input placeholder="PROJECTWhat's on your mind?" class="status-input" type="text"> 
</div> 

<div class="tab-pane" id="skill-tab"> 
    <input placeholder="SKILLWhat's on your mind?" class="status-input" type="text"> 
</div> 

希望這有幫助

謝謝， Zeshan