如何实现Bootstrap表格内容过长自动省略，鼠标悬停显示完整内容？

本文共计198个文字，预计阅读时间需要1分钟。

bootstrap表格内容过长成省略号

/**字符串过长 转化为 。。。**/ table{ width:100px; table-layout:fixed;/* 只有定义了表格的布局算法为fixed，下面td的定义才能起作用。 */ } td{ width:100%; word-break:keep-all;/* 不换行 */ white-space:nowrap;/* 不换行 */ overflow:hidden;/* 内容超出宽度时隐藏超出部分的内容 */ text-overflow:ellipsis;/* 当对象内文本溢出时显示省略标记(...) ；需与overflow:hidden;一起使用*/ -o-text-overflow:ellipsis; -icab-text-overflow: ellipsis; -khtml-text-overflow: ellipsis; -moz-text-overflow: ellipsis; -webkit-text-overflow: ellipsis; } 鼠标悬停表格显示全部内容

var defaults = { url: '', dataField: "rows", method: 'post', dataType: 'json', selectItemName: 'id', clickToSelect: true, pagination: false, smartDisplay: false, sidePagination: 'server', queryParamsType : null, columns: [], onLoadSuccess:function(){ //鼠标悬停显示全部内容~ $('.bootstrap-table tr td').each(function () { $(this).attr("title", $(this).text()); $(this).css("cursor", 'pointer'); }); } // clickToSelect:false,//点击不选中~ } var option = $.extend({}, defaults, opt); $(this).bootstrapTable(option);