我们在jquery数据表中使用Scroller插件来允许虚拟滚动.但是,我们要求支持单元格内的文本换行,因为用户希望查看整个文本而不是截断的文本.我发现默认情况下它不会包装文本.有没有办法支持这个功能？任何可能的解决方法？
提琴手
https://jsfiddle.net/Vimalan/2koex0bt/1/
display" cellspacing="0" width="100%">
js代码：
var detailsSample = "DataTables and its extensions are extremely configurable libraries and almost every aspect of the enhancements they make to HTML tables can be customised. Features can be enabled,disabled or customised to meet your exact needs for your table implementations."
var dataList = [];
for (var i=1; i<=500; i++)
{
var daTarow = {};
daTarow.ID = i;
daTarow.FirstName = "First Name " + i;
daTarow.LastName = "Last Name " + i;
if (i%5 ==0)
{
daTarow.Details = detailsSample;
}
else
{
daTarow.Details = "Large text "+i;
}
daTarow.Country = "Country Name";
dataList.push(daTarow);
}
$('#example').DataTable( {
data: dataList,deferRender: true,scrollX: true,scrollY: 200,scrollCollapse: true,scroller: true,searching: false,paging: true,info: false,columns: [
{ title: "ID",data: "ID" },{ title: "First Name",data: "FirstName" },{ title: "Change Summary",data: "LastName"},{ title: "Details",data: "Details","width": "400px" },{ title: "Country",data: "Country" }
]
} );
期望
在上表中,“Details”列的宽度应始终为400px,并且该列中的文本应该换行.
任何建议将不胜感激.
最佳答案
通过将列数据包装在div中并设置div的white-space,width css属性来找到解决方案.
小提琴手：https://jsfiddle.net/Vimalan/2koex0bt/6/
JS
$('#example').DataTable( {
data: dataList,scrollX: true,searching: false,paging: true,info: false,data: "Details" },data: "Country" }
],columnDefs: [
{
render: function (data,type,full,Meta) {
return "
CSS
.text-wrap{
white-space:normal;
}
.width-200{
width:200px;
}
原文地址：https://www.jb51.cc/css/427666.html
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
相关推荐
