Question

希望我能得到一些帮助，我建立一个有5个表格的页面。其中2个可使用（http://www.kryogenix.org/code/browser/sorttable/）

进行排序

一个相当大的我希望它可以折叠，我尝试使用它： HTMl drilldown table: Design

但是，当我启用它时，所有表都可以折叠，这是上面问题中的jQuery。

 <script type='text/javascript'>//<![CDATA[
   $(window).load(function(){
   $('thead').on('click', function(){
   $(this).next('tbody').toggleClass('collapsed');
 });
});

我不熟悉jQuery，因此不确定如何修改它，因此它只使用了一个表。我尝试使用表格ID，但它没有用。

<?php
 $qcTable = "<table id ='thcol'>";
 foreach($tableArray as $cat=>$catData)
    {
     $title = ucwords(str_replace("_"," ",$cat));
     $score = number_format($catData['sc'],2);
     $qcTable .= "<thead><tr><th>$title ($score%)</th></tr></thead><tbody class='collapsed'>";
 foreach($catData as $td=>$subCatData)
   {if($td != 'a' && $td != 'b' && $td != 'c'  && $td != 'sc'){
   $getSubCat = explode("__",$subCatData['b']);
     if(sizeof($getSubCat) ==1)
          $subTitleBuild = $getSubCat[0];
     else
          {
              unset($getSubCat[0]);
              $subTitleBuild = implode(" > ",$getSubCat);
    }
  $subtitle =  ucwords(str_replace("_"," ",$subTitleBuild));
           $subscore = number_format($subCatData['sc'],2);
     $qcTable .= "<tr><td>$subtitle ($subscore%)</td></tr>";
      }
 }            $qcTable .= "</tbody>";
      }



$qcTable .= "</table>";
echo $qcTable;
?>

其他两个表格看起来像这样：

  <table class = 'sortable'><thead><th class='sorttable_numeric'>
  Ticket ID</th><th>Game</th><th>Agent</th><th>Score</th><th>Star</th></thead><tbody>

提前谢谢你， ç

Answer 1

你的行

$('thead').on('click', ...);

在所有<thead></thead>标记上放置点击事件的处理程序，当你用PHP编写它们时，你应该把一个类放在你想要崩溃的类上，如<thead class="collapsable"></thead>，然后你的JavaScript行将是：

$('thead.collapsable').on('click', ...);

这样，只有thead个collapsable类标签才能触发崩溃。

折叠表适用于页面

1 个答案: