0

jQueryでWebアプリを開発しています。固定幅の列と、javascript が行の内容を入力したテーブルがあります。

問題: 1 つの列の幅が 140px です。このコラムのほとんどの文章は短く、この幅に収まります。フォントはモノスペースではありません。いくつかの長い文章があり、td が 2 行あり、行の高さが 20px を超えています。

こうなってほしくないので、長文を短くしなければなりません

私の最初のアイデアは、td に値を入力し、その直後に td または行の高さを確認することでした。高さが 20px より大きい場合は、文を短くする必要があります。

しかし、これにより、行が値を取得するときにテーブルの行が「ちらつき」ます。

したがって、他のアイデアは、目に見えない div または span を作成し、前と同じことを行うことです。

以前にこれを行って、私の問題の良い解決策を見つけた人はいますか?

4

3 に答える 3

2

テキストのサイズを計算する方法はありません。少なくとも移植可能な方法はありません。どのフォントが使用されるかを確実に知ることさえできません。

代わりに、CSS を使用して を強制的にtd固定サイズにし、オーバーフローするテキストをすべて無視することもできます。overflow: hiddenあなたが行く必要があります。こちらも使いたくなるかもwhite-space: nowrap。

于 2013-01-15T15:34:41.997 に答える
1

CSSでサイズ変更を防ぐことができます：

table { table-layout:fixed; }
table td, table th { white-space:nowrap; overflow:none; }
于 2013-01-15T15:36:25.090 に答える
1

セルの高さを設定してから text-overflow: ellipsis を使用するのはどうですか?

table td { text-overflow: ellipsis; max-height: 20px; }

編集：フィドルを修正しました-例を次に示します： JSFiddle-tdと省略記号

于 2013-01-15T15:38:16.723 に答える