JavaScriptからテーブルの列幅をサイズ変更する方法
-
03-07-2019 - |
質問
javascriptに問題があります。
TabListにテーブルセルのリストが保存されています。
最大幅を見つけて、この幅をすべてに設定したい。
サンプルコードはここにありますが、幅の設定は機能していません。
var MaxTabWidth = 0;
for (var i = 0; i < TabList.length-1; i++)
{
if (TabList[i].offsetWidth>MaxTabWidth)
MaxTabWidth = TabList[i].offsetWidth;
}
for (var i = 0; i < TabList.length-1; i++)
{
TabList[i].style.width = MaxTabWidth+"px";
// TabList[i].width = MaxTabWidth+"px";
// TabList[i].offsetWidth = MaxTabWidth+"px";
}
自分の試みについてコメントしました。
助けがありますか?
これ
私のためにトリックをしなかった..
更新:
classNameをチェックしていたため、TabListはCellsのリストであると確信しています。
最後のセルでテーブルの残りの幅を埋めたいので、TabList.length-1までループしています。
解決
すべてのcss /スタイリングをページから削除し、問題を特定するためにテストすることをお勧めします。このようなことはしばしばcssによって複雑になります。
他のヒント
テーブル全体の幅を--i * MaxTabWidthに設定した場合。それは列を均等に分散しますか?テーブルの名前がmyTableであるとします。
document.getElementById('myTable').width = new String(--i*MaxTabWidth)
編集:しない
for (var i = 0; i < TabList.length-1; i++)
TabList.length-2で停止して最後の列をスキップしますか
価値があるものとして、jQueryでは、テーブルのIDが&quot; myTable&quot;である次のスクリプトを使用してこれを実行できます。フレームワークに追加する環境を十分に制御できる場合は、これらのようなタスクがはるかに簡単になるため、強くお勧めします。
var maxWidth = 0;
$("#myTable td").each(function() {
if ($(this).width() > maxWidth) {
maxWidth = $(this).width();
}
});
$("#myTable td").width(maxWidth);
所属していません StackOverflow