2016-08-19 8 views
0

私はいくつかの行だけが崩壊するテーブルを作成しようとしています(この例では最初の行のみ)。ブートストラップの折りたたみテーブルの行

「受信可能性」をクリックすると、折りたたみエキスパンドエフェクトはうまくいっていましたが、行の1つをクリックすると同じ問題が発生しました... 折りたたみエキスパンドエフェクト 「受領可能性」をクリックした場合のみです。ここで

コードです:

<div id="feat-exam" class="panel panel-info"> 
    <div class="panel-heading"> 
    <ul class="list-group"> 
     <li class="list-group-item" data-toggle="collapse" data-target=".RECEV"> 
     <strong>Recevability</strong> 
     <table> 
      <tr class="collapse RECEV"> 
      <td> 
       <em>item1.1</em> 
      </td> 
      <td> 
       <em>item1.2</em> 
      </td> 
      </tr> 
      <tr> 
      <td> 
       <em>item2.1</em> 
      </td> 
      <td> 
       <em>item2.2</em> 
      </td> 
      </tr> 
     </table> 
     </li> 
    </ul> 
    </div> 
</div> 

あなたはjsfiddleに自分を試すことができます。 collapsing rows table on jsfiddle

あなたのいくつかは見てみましょうことができますか?

答えて

0

テーブルを別のliに移動し、最初に強いタグを配置すると、探している結果が得られます。ここではそれが私の感想だ:私はちょうどTRレベルでクラス=「崩壊RECEV」を追加した場合

<div id="feat-exam" class="panel panel-info"> 
    <div class="panel-heading"> 
    <ul class="list-group"> 
     <li class="list-group-item" data-toggle="collapse" data-target=".RECEV" style="display:true"> 
     <strong>Recevability</strong> 
     </li> 
     <li class="collapse RECEV"> 

     <table style="width:100%"> 
      <tr> 
      <td> 
       <em>item1.1</em> 
      </td> 
      <td> 
       <em>item1.2</em> 
      </td> 
      </tr> 
      <tr> 
      <td> 
       <em>item2.1</em> 
      </td> 
      <td> 
       <em>item2.2</em> 
      </td> 
      </tr> 
     </table> 
     </li> 
    </ul> 
    </div> 
</div> 

https://jsfiddle.net/f030he9x/

+1

どうもありがとうMaarek :)、それが期待どおりに仕事です! –

関連する問題