ecology8设置明细表的奇偶行底色交错(斑马线)

给明细表的奇偶行设置底色交错,可增强视觉效果。

ecology8设置明细表的奇偶行底色交错(斑马线)

 

 1 /**
 2  * 奇偶行底色交错(斑马线)
 3  * @param {*} $tbody 表格的tbody对应的jQ对象
 4  * @param {*} basicId 基准取值字段id
 5  * @param {*} backgroundColor 背景颜色,默认浅灰
 6  */
 7 function setZebraCrossing($tbody, basicId, backgroundColor) {
 8     if (backgroundColor == undefined) {
 9         backgroundColor = "rgb(220, 220, 220)";
10     }
11     $tbody.children("tr[_target='datarow']").each(function (index, element) {
12         if (index == 0) {
13             return true;
14         }
15         var prevColor = $(this).prev().css("background-color");
16         var value = $("#" + basicId + "_" + index).val();
17         var prevValue = $("#" + basicId + "_" + (index - 1)).val();
18         var newColor = prevColor;
19         if (value != prevValue) {
20             newColor = prevColor == "rgba(0, 0, 0, 0)" ? backgroundColor : "rgba(0, 0, 0, 0)";
21         }
22         $(this).css("background-color", newColor);
23     });
24 }

举个例子:

1 setZebraCrossing($("#oTable2>tbody"), "field12345");

 

上一篇:今日所学—jQuery基础


下一篇:js清空table的tbody中的数据