1. 概述
1.1 問題描述
如果我們對報表設定了隔列變色（隔列/欄設定背景色），又設定了條件屬性來隱藏列高，那麼原本的隔列變色看起來會很混亂。
例如，隔列變色在隱藏了「運貨商」為 1 的列後效果如圖：
如何實現隱藏列後依舊保持隔列變色呢？
1.2 解決思路
方案一：在設定背景色時利用公式 IF()，如果隱藏列的條件成立，被隱藏列不執行隔列變色的條件，否則就執行。
方案二：在「範本>範本 Web 屬性>分頁預覽設定」中新增「載入結束」事件，利用 JavaScript 程式碼實現。
2. 範例
2.1 準備範本
開啟範本%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Primary\DetailReport\隔列設定背景色.cpt
2.2 隱藏列
選中 E2 儲存格，新增條件：當運貨商等於 1 時，列高為 0。屬性下拉選擇「列高」，條件類型為「普通」，條件設定為「等於字串 1」，完成後點選「增加」。步驟如下圖所示：
2.3 方案一：設定背景色
將 A2 儲存格「條件屬性>背景」設定中的公式修改為：IF(E2!=1,SEQ()%2=0,FALSE)
2.4 方案二：新增載入結束事件
1）設定隱藏列後，將 A2 儲存格原本的「條件屬性」刪掉。
2）點選菜單欄「範本>範本 Web 屬性>分頁預覽設定」，選擇「為該範本單獨設定」。在頁面下方事件設定處，點選「新增」按鈕，選擇「載入結束」事件，在彈出的事件設定對話框中輸入 JavaScript 程式碼如下：
$(".x-table tr:visible").each(function(i) {
if (i % 2 == 0 && i >= 1) {
$(this).css("background-color", "#ccccfd");
}
});
注：其中，i>=1 中的 1，是由開始變色的儲存格所在列數減 1 得來的。
步驟如下圖所示：
2.5 效果預覽
PC 端
儲存報表，點選「分頁預覽」，效果如下圖所示：
行動端
方案二新增「載入結束」事件不支援行動端，方案一 App 端和 H5 端均支援，效果如下圖所示：
3. 決策報表JS範例
相同效果想要在決策報表中使用 JS 事件實現，該怎麼做呢？
3.1 製作範本
建立決策報表，在決策報表中拖入一個報表塊，報表塊中表格設計同上述範本一致。並在 E2 儲存格新增相同的條件屬性，A2 儲存格不設定條件屬性。
3.2 新增初始化後事件
選中報表塊，在右側面板中點選「事件」，新增「初始化後」事件，輸入 JavaScript 程式碼如下：
setTimeout(function() {
$(".x-table tr:visible").each(function(i) {
if (i % 2 == 0 && i >= 1) {
$(this).css("background-color", "ccccfd");
}
});
}, 1000);步驟如下圖所示：
3.3 效果預覽
儲存報表，點選「PC端預覽」，效果如下圖所示：
注：不支援行動端。
