表格的奇偶行设定不同的颜色,单击变色

style

.selected{ background-color:#FF6;}
.se{background-color:#666;}
.even{background:#ecf6fc; 
}
.odd{background:#F0F0F0;            }
.over{background:#bcd4ec;            }
.click{background:Aqua;          }
/style
table  class="stripe" width="50%" border="1"cellpadding="2" cellspacing="0"  bordercolor="#bcd4ec" bgcolor="#efefef"
tr class=""
 
        td width="80px">
村组
        td width="80px">
总金额(元)
        td width="80px">
序号
/td


    /tr>

  $(document).ready(function(){
                                  //鼠标移入该行和鼠标移除该行的事件
                                  $(".stripe tr").mouseover(function(){
                                              $(this).addClass("over");
                                  }).mouseout(function(){
                                            $(this).removeClass("over");
                                  });
                                //为表格的奇偶行设定不同的颜色
                                $(".stripe tr:even").addClass("even");
                                $(".stripe tr:odd").addClass("odd");
                              //鼠标点击事件
                              $(".stripe tr:gt(0)").bind("click",function(){
                                              $(".stripe tr:gt(0)").removeClass("click");
                                              $(this).addClass("click");
                              });

                });

猜你喜欢

转载自blog.csdn.net/ilwtfqqc/article/details/79121827