设置表格隔行变色,以及鼠标悬浮变色效果

function SetTableInterfaceColor(o) { var maxrowspan = 0; var witebk = "whitebk"; var graybk = "graybk"; if (o) { graybk = witebk } var bluebk = "graybkhover"; var bk = graybk; var bkattr = "bg_color"; $(".tableCss tbody tr").each(function () { var bkother = bk == witebk ? graybk : witebk; if (maxrowspan > 0) { $(this).removeClass(bkother).addClass(bk).attr(bkattr, bk); maxrowspan-- } else { bk = bkother; bkother = bk == witebk ? graybk : witebk; $(this).children().each(function () { var maxrow = parseInt($(this).attr("rowspan"), 10); if (isNaN(maxrow)) { maxrow = 0 } maxrowspan = Math.max(maxrow, maxrowspan) }); $(this).removeClass(bkother).addClass(bk).attr(bkattr, bk); maxrowspan-- } }); function setprev(obj, oldbk, tbk) { var o = $(obj).prev(); if (o != null && o != undefined) { if (o.attr(bkattr) == oldbk) { o.removeClass(witebk).removeClass(graybk).removeClass(bluebk).addClass(tbk); setprev(o, oldbk, tbk) } } } function setnext(obj, oldbk, tbk) { var o = $(obj).next(); if (o != null && o != undefined) { if (o.attr(bkattr) == oldbk) { o.removeClass(witebk).removeClass(graybk).removeClass(bluebk).addClass(tbk); setnext(o, oldbk, tbk) } } } if (!o) { $(".tableCss tbody  tr").bind("mouseover", function () { $(this).removeClass(witebk).removeClass(graybk).addClass(bluebk); var tbk = $(this).attr(bkattr); setprev(this, tbk, bluebk); setnext(this, tbk, bluebk) }); $(".tableCss tbody  tr").bind("mouseout", function () { var tbk = $(this).attr(bkattr); $(this).removeClass(bluebk).addClass(tbk); setprev(this, tbk, tbk); setnext(this, tbk, tbk) }) } };

支持合并行隔行变色效果,默认带有合并行认为为一行。

使用方法:

SetTableInterfaceColor();或者SetTableInterfaceColor(1);
两者效果是不一样的,后面没有隔行变色。
注意:需要自己定义样式:whitebk,graybk,graybkhover.
原文地址:https://www.cnblogs.com/maomao999/p/4831466.html