帆軟報表（finereport）鼠標懸停背景變色

在報表中，為了突出鼠標所在單元格，當鼠標懸浮時突出背景色（字體），鼠標離開后恢復原有的背景色（字體）。

 

 

在設計器 模板>模板 Web 屬性>填報頁面設置，去除填報當前編輯行背景設置的勾選，在事件設置中添加【加載結束】事件：

 

 

//鼠標經過
$(".x-table td").mousemove(function() {
//所在行背景色:紅色
        $(this).css("background-color","red");
//所在行單元格字體:18px
        $(this).css("font-size","18px");
});
//鼠標點擊
$(".x-table td").mousedown(function() {
//所在行背景色:黃色
        $(this).css("background-color","yellow");
//所在行單元格字體:18px        
        $(this).css("font-size","18px");
});
//鼠標離開
$(".x-table td").mouseout(function() {
//所在行背景色:白色
        $(this).css("background-color","white");
//所在行單元格字體:12px 
        $(this).css("font-size","12px");
});

當鼠標懸浮當前行時改變背景色字體

//鼠標經過
$(".x-table tr").mousemove(function() {
//所在行背景色:紅色
        $(this).css("background-color","red");
//所在行單元格字體:18px
        $(this).find("td").css("font-size","18px");
});
//鼠標點擊
$(".x-table tr").mousedown(function() {
//所在行背景色:黃色
        $(this).css("background-color","yellow");
//所在行單元格字體:18px        
        $(this).find("td").css("font-size","18px");
});
//鼠標離開
$(".x-table tr").mouseout(function() {
//所在行背景色:白色
        $(this).css("background-color","white");
//所在行單元格字體:12px 
        $(this).find("td").css("font-size","12px");
});