3

大きな(2000以上のエントリ)テーブルのブートストラップとjqueryを備えたサイトでDatatablesを使用しています。一部の (テキスト) 値は長すぎます。現在、次のようなものを使用しています。

render: function ( data, type, row ) {
                        return data.length > 35 ?
                        data.substr( 0, 35 ) +'…' :
                            data;
                    }

文字列を切り取り、html タイトルに完全な値を表示するには、Datatables を使用します。これを行うより良い方法はありますか?クリックすると自動的にカットされてすべて表示されるプラグインのようなものですか? 私は何かを見つけることができませんでした。

jquery dotdotdot を見ましたが、クリックして拡張することはできません。

4

1 に答える 1

6

文字列をより見やすくしたり、特定の DOM 要素に「適合」させるために JavaScript で文字列を変更することは、絶対に禁止されています。特に、ここにコールバックで前処理されている多くの文字列がある場合。

一部(またはすべて)の列に固定幅を強制する場合、例:

table.dataTable td:nth-child(3) {
  max-width: 100px;
}

次に、単純な CSS を使用して、列のコンテンツがラップされないようにし、マージンを超えないようにし、大きすぎる場合は適切な省略記号を表示することができます。

table.dataTable td  {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

デモ -> http://jsfiddle.net/ax1gr1og/

于 2016-07-13T09:46:22.323 に答える