/***********本人原创,欢迎转载,转载请保留本人信息*************/
作者:wallimn 电邮:
[email protected] 时间:2009-09-24
博客:http://wallimn.iteye.com
网络硬盘:http://wallimn.ys168.com
/***********文章发表请与本人联系,作者保留所有权利*************/
现在网页上的表格,当鼠标经过的行高亮显示是个很不错的功能。display标签是个很不错的标签,但是,不支持鼠标经过行变色功能,看了看displaytag的源码,它甚至没有给人留下直接可用的扩展接口。
当然,修改源码可以实现,但我一直认为如不是实在迫不得以,不要修改第三方插件源码,会给今后的升级带来问题。
今天看了看decorator(包装器?、修饰器?)的相关知识,只有有限几个可用的回调接口,反复看了几遍apidoc及源码。受SQL注入思想的启发,找到了一个很极为巧妙有创意的方法,通过自定义decorator来实现display标签生成的表格鼠标经过变色功能。
代码很简单,共两部分,全部贴在下面:
一、java代码
package com.wallimn.gyz.util;
import org.displaytag.decorator.TableDecorator;
/**
* 超级简单的实现displaytag标签表格行鼠标经过变色功能<br/>
* 博客:http://wallimn.iteye.com,转载请保留此信息!!<br/>
* 编码:wallimn 时间:2009-9-24 下午05:05:30<br/>
* 版本:V1.0<br/>
*/
public class OverOutWrapper extends TableDecorator {
public OverOutWrapper(){
super();
}
@Override
public String addRowId() {
return "i_d\" onmouseover=\"if (typeof(window.m_over)=='function') window.m_over(this);\" onmouseout=\"if (typeof(window.m_out)=='function') window.m_out(this);\" title=\"博客:http://wallimn.iteye.com";
}
}
二、jsp测试代码
<script type="text/javascript">
function m_over(tr){
tr.className=tr.className + " " + "trmo";
}
function m_out(tr){
var cn = tr.className.replace(/\s+trmo/,'');
tr.className = cn;
}
</script>
<style type="text/css">
.trmo{
background-color:#FFCCFF !important;
}
</style>
<h3>隔壁老王(http://wallimn.iteye.com)</h3>
<display:table name="${items}" id="row" class="gyz dtt" decorator="com.wallimn.gyz.util.OverOutWrapper">
<display:column property="dm" title="代码" style="width:60px" />
<display:column property="mc" title="名称"/>
</display:table>