鼠标点击改变单元格颜色或点击改变行颜色

单击改变行颜色

打开一模板如： %FR_HOME%\WebReport\WEB-INF\reportlets\GettingStarted.cpt模板，点击 模板>模板web属性>分页预览设置，选择为该模板单独设置，然后添加加载结束事件，具体js如下：

1. contentPane.makeHighlight('red'); //使点击的行变成红色  

分页预览模板，当鼠标点击某行时，某行变色。

如果要实现鼠标滑过改行是改变颜色，js语句修改为：

1. contentPane.makeHighlight('red','mouseover');  

如果使用了条件属性中的隔行显示不同的背景色，还要实现鼠标点击该行高亮显示，js语句修改为：

1.

1. contentPane.makeHighlight('red',  '' ,true);  

2. 点击改变单元格颜色

  JS代码设置

因为此模板是需要进行填报预览的，打开菜单模板>模板web属性>填报页面设置，去掉填报当前编辑行背景设置选项的勾选，在事件设置中新加一个加载结束事件，输入JS代码，如下图：

1. var $lasttd;//上一个单元格变量  
2. var lastcolor;//上一次颜色变量  
3. $('.x-table td').click(function(){  
4.     if($lasttd){  
5.         $lasttd.css('background',lastcolor);  
6.     }   //离开后原单元格恢复原色  
7.     lastcolor=$(this).css('background-color');  
8.     if(!lastcolor)  
9.     lastcolor=$(this).css('background');//保存原始颜色  
10.     $(this).css('background','red');//设置当前单元格为红色  
11.     $lasttd=$(this);//保存上一个单元格  
12. });