我正在使用DataTables表组件,其中一列有很长的数据行。目前,这些数据基本上通过将列宽扩展到适合数据所需的数量来显示,从而添加水平滚动条。
我想限制列像这样扩展和要包装的文本。
这是当前代码的样子
var dt = $(document).ready(function() {
var dt =$('#feedback-data-table').DataTable( {
ajax: {
url: "http://127.0.0.1:7101/Oats/rest/v1/testidmap?onlyData=true&limit=999",
dataSrc: "items"
},
columns: [
{ title: "Test Name", data: "TestName" },
{ title: "User Activity Info (~ separated)", data: "Useractivityinfo"}
]
} );
} );
请告知如何实现这一目标。增加宽度:" 100px"像这样没有用。
答案 0 :(得分:1)
<强>解强>
您可以对包含长文本的列使用CSS规则word-break: break-all;
,而不会有任何空格来破坏任何字符之间的单词。
<强>的JavaScript 强>
$(document).ready(function (){
var table = $('#example').DataTable({
columnDefs: [
{ targets: 5, className: "word-break-all" }
]
});
});
<强> CSS:强>
.word-break-all {
word-break:break-all;
}
有关详细信息,请参阅word-break
。
<强>样本强>
请参阅this jsFiddle以获取代码和演示。
答案 1 :(得分:0)
您可以将以下内容用于CSS并查看吗?
table {
table-layout:fixed;
}
th {
word-rap: break-word
}