0

ヘッダーを修正できるデータグリッド テーブルを作成しようとしています。テーブルを 2 つの DIV 要素内に配置し、テーブルの THEAD 部分を修正しました。テーブルに動的にデータを入力すると、異なる数の列が存在する可能性があり、毎回異なる幅になる場合があります。

<DIV style="position: relative; width="500px">
 <DIV style="height:105px; overflow: auto;">
  <TABLE width="502px">
    <THEAD>
      <TR style="left:-1px;top: 0;position: absolute;">
        ... header content ...
      </TR>
    </THEAD>
    <TBODY>
      ... data columns ...
    </TBODY>
  </TABLE>
 </DIV>
</DIV>

このソリューションは、垂直オーバーフローに適しています。しかし、私は横のオーバーフローに苦労しています。THEADs TR 要素を修正したため、テーブルが DIV 幅を超えると、水平スクロール バーが表示され、データを水平方向にスクロールできますが、タイトルは静的でスクロールしません。

動的に作成されたスクロールバーのID/名前を取得できれば、jQueryを使用してテーブルヘッダーをスクロールできるのではないかと考えていましたが、これが正しい解決策なのか、それが可能なのかさえわかりません。

4

1 に答える 1

0

多くの人が、html と css を使用してテーブルの固定ヘッダーと左列を作成しようとしましたが、スクロールしても固定されたままになりますが、残念ながら機能しません。

唯一のオプションは、javascript を使用して、スクロールするテーブルを操作することです。推奨する特定のコードはありませんが、Google 検索を行ってください。

于 2012-07-19T23:41:50.630 に答える