牛骨文教育服务平台(让学习变的简单)
博文笔记

jsp:超出字数显示省略号;鼠标悬停显示完整文本

创建时间:2017-07-18 投稿人: 浏览次数:2125

**

一. 需求:

**
列表页中,控制某一列中的文字显示:只显示前16个字符,超出部分用省略号代替。当鼠标悬停时,显示该列的全部内容。

**

二. 解决方案:

**
使用css来处理这个问题:
在jsp文件中,添加内部样式:

.ellipsis {
            overflow: hidden; /*自动隐藏文字*/
            text-overflow: ellipsis;/*文字隐藏后添加省略号*/
            white-space: nowrap;/*强制不换行*/
            width: 16em;/*不允许出现半汉字截断*/
        }

然后,在列中使用该样式:

<td><div class="css2" title="${msgContent}">${msgContent}</div></td>

即可。
注意:

1.在div里面添加:

title="${msgContent}"

这一语句即可实现鼠标悬停显示全部文字效果。

2.该样式直接添加在td中,如写成:

<td class="css2">${item.msgContent}</td>

无法实现省略号的效果。需要添加一个div容器。

**

三.补充方式:

**
百度的时候,还找到了另一个方法,就是直接使用struts2自带的属性
先引入

 <%@ taglib prefix="s" uri="/struts-tags" %>

然后在td中写:

<s:if test="remark.length()>5">    

     <s:property value="remark.substring(0,5)" />

          <a href="#"  style="cursor:default;text-decoration:none;color:#0000ff;" title="${item.remark }">...</a>//鼠标移动到省略号时显示省略的字符

</s:if>    

 <s:else>    

     <s:property value="remark" />    

</s:else>

不过由于项目里面没有引入struts,因此没有去验证这个方法是否正确。先添加在这里做个备份。

声明:该文观点仅代表作者本人,牛骨文系教育信息发布平台,牛骨文仅提供信息存储空间服务。