1. 描述编辑
在实际应用中,有的单元格可能内容较多,如何能做到内容超出一定长度显示省略号(...),当鼠标移动到单元格的时候,显示全部内容呢?
(方法1、2)
(方法3)
2. 解决方案编辑
2.1 方法一(公式实现)
注:此方法虽然简单,但报表以其他格式导出时,文件中该单元格的内容仍然是省略的,所以当涉及到报表导出时不要使用方法一,使用方法二即可。
1)在A2单元格输入一段文字如:对单元格设置超过一定长度页面显示...,鼠标放上去显示全部值。
2)在单元格形态,给单元格设置公式形态,if(len($$$)>5,left($$$,5)+'...',$$$),当单元格内容长度超过 5 位时,显示内容前 5 位加上省略号(...),当单元格内容长度小于等于 5 位时,显示全部内容:
3)在单元格其他属性,内容提示设置为=$$$,如下图:
设置完成后,即可实现效果。
2.2 方法二(JS 实现)
1)在 A2 单元格输入一段文字如:对单元格设置超过一定长度页面显示...,鼠标放上去显示全部值。
2)点击模板>模板web>分页预览设置,添加加载结束事件,如下图:
JS 代码如下:
//获取到 td 中的字符串,截取字符串 $("td[title^=cut]").each(function(){ //获取属性的值 var str = $(this).attr('title'); //定义分隔符号 var length = parseInt(str.split(":")[1]); //判断长度 if($(this).text().length > length){ $(this).attr('title',$(this).text()); $(this).text($(this).text().substring(0,length)+'...'); }else $(this).removeAttr('title'); })
3)在 A2 单元格其他属性,内容提示输入:cut_+A2+:+5,cut_+A2+:+5中,A2 是单元格的位置;5 是显示的个数;冒号是英文符号,且前后需要使用+进行拼接,如下图:
设置完成后,即可实现效果。
2.3方法三(HTML实现)
1)写两条虚拟数据,再拖到指定单元格:
对单元格设置超过一定长度页面显示...,鼠标放上去显示全部值。
dui dan yuan ge she zhi chao guo yi ding chang du...。
2) 在单元格形态,给单元格设置公式形态,"<span style='white-space: nowrap;text-overflow:ellipsis; overflow:hidden; display: inline-block;width:140px;'>"+$$$+"</span>",当单元格内容宽度超过140px后,显示内容超过的部分会变成省略号(...),当单元格内容宽度不超过140px时,显示全部内容:
3) 在单元格其他属性中,显示内容设置为 用HTML显现内容,内容提示设置为=$$$,如下图
设置完成后,即可实现效果。