0

jquery でテーブルの開いている行を閉じ、別の行を開こうとすると問題が発生します。toggle() を無駄に使用しようとしていますが、何かが足りないことがわかっています。これが私のhtmlです：

<table class="ProcTable" rules="all" cellpadding="0" cellspacing="0">
   <thead>   
      <tr class="proctablerow">
         <th>Recently Issued Procedures</th>         
      </tr>
   </thead>
   <tbody>
      <tr>
         <td></td>
         <td>Admin</td>
         <td>User Name #1</td>
      </tr>
      <tr>
         <td></td>
         <td>Reader</td>
         <td>User Name #2</td>
      </tr>
      <tr>
         <td></td>
         <td>Reader</td>
         <td>User Name #3</td>
      </tr> 
      </tbody>    
</table>
<table class="ProcTable" rules="all" cellpadding="0" cellspacing="0">
   <thead>   
      <tr class="proctablerow">
         <th>Recently Viewed Procedures</th>         
      </tr>
   </thead>
   <tbody>
      <tr>
         <td></td>
         <td>Admin</td>
         <td>User Name #1</td>
      </tr>
      <tr>
         <td></td>
         <td>Reader</td>
         <td>User Name #2</td>
      </tr>
      <tr>
         <td></td>
         <td>Reader</td>
         <td>User Name #3</td>
      </tr>
      </tbody>      
      </table>
      <table class="ProcTable" rules="all" cellpadding="0" cellspacing="0">
   <thead>   
      <tr class="proctablerow">
         <th>Bookmarked Procedures</th>         
      </tr>
   </thead>
   <tbody>
      <tr>
         <td></td>
         <td>Admin</td>
         <td>User Name #1</td>
      </tr>
      <tr>
         <td></td>
         <td>Reader</td>
         <td>User Name #2</td>
      </tr>
      <tr>
         <td></td>
         <td>Reader</td>
         <td>User Name #3</td>
      </tr>
      </tbody>      
      </table>

      </table>

これが私のjqueryコードです：

$(document).ready(function() {    
    $("#accordion").accordion( { active: false, collapsible: true });
    $(".ProcTable").accordion( { active: false, collapsible: true, autoHeight: false });  

    $('table.ProcTable tr.proctablerow th') .click(
    function() {
        $(this) .parents('table.ProcTable') .children('tbody') .toggle();
    });

});

誰かが別の行を開いている間にある行を閉じる方法を理解するのを手伝ってもらえますか (アコーディオン スタイル)。ありがとう！

4

1 に答える 1

0 
$('table.ProcTable tr.proctablerow th').on('click', function() {
    var elm = $(this).parents('table.ProcTable').children('tbody');
    $('table.ProcTable').children('tbody').not(elm).hide();
    elm.toggle();
});

フィドル

于 2012-07-27T19:39:47.003 に答える