qq_15337205
轩雨兴锋
2015-02-11 05:09
采纳率: 50%
浏览 3.4k
已采纳

table内容是遍历出来的,并且有合并行未合并行,想实现隔行变色该怎么做。

<table id="sample2" width="100%" border="0" cellpadding="0" cellspacing="0">
                <thead style="height: 40px">
                <tr class="Reprot_Head" style="height: 40px">
                     <th style="width:4%">称谓</th>
                      <th style="width:4%">姓名</th>
                       <th style="width:4%">民族</th>
                        <th style="width:4%">政治面貌</th>
                          <th style="width:8%">身份证号<br>联系电话</th>
                         <th style="width:20%">户口登记地详细地址<br>经常居住地详细地址</th>
                          <th style="width:30%">户口登记地派出所名称、邮编<br>经常居住地派出所名称、邮编</th>
                           <th style="width:10%">工作单位及职务<br>单位详细通信地址、邮编</th>
                            <th style="width:5%">备注</th>
                             <th style="width:10%">操作</th>

                </tr>
                </thead>
                <tbody>

                  <s:iterator value="listqinshu" var="y" status="i">

                        <tr ondblclick="onshow(${y.qinshuid});">
                            <td class="left" rowspan="2" style="text-align: center;"> ${y.chengwei} </td>
                            <td rowspan="2" style="text-align: center;">  ${y.xingming} </td>

                            <td rowspan="2" style="text-align: center;">
                            ${y.minzu} </td>
                            <td  style="text-align: center;" rowspan="2">
                             <c:if test="${3 == y.mianmaoid }">群众</c:if>  
                             <c:if test="${2 == y.mianmaoid }">团员</c:if> 
                             <c:if test="${1 == y.mianmaoid }">党员</c:if>  
                             </td>
                                <td>  ${y.iccard }  </td>
                            <td style="text-align: left;">  
                              ${y.jg_pro} &nbsp; ${y.jg_city} &nbsp;${y.jg_county}
                              &nbsp;${y.jg_dizhi}</td>
                            <td style="text-align: left;"> 
                            ${y.jgp_pro} &nbsp; ${y.jgp_city} &nbsp;${y.jgp_county}
                              &nbsp;${y.jgp_yb}</td>
                            <td> 
                             ${y.danwei} &nbsp; </td>

                        <td rowspan="2" style="text-align: center;">
                         ${y.memo}
                        </td>
                        <td class="right" rowspan="2" style="text-align: center;">
                                <label> 
                     <input  style="height: 12px;" 
                      <c:if test="${ 0 ==  y.check1}">checked="checked" </c:if>
                      <c:if test="${0 !=  y.check1 && 4 != y.check1 && (1 == y.zhiye || 2== y.zhiye || 3== y.zhiye) }">checked="checked" </c:if> type="checkbox" id="checkbox1" name="qinshu_${y.qinshuid}" value="0" ></input></label>
                                  工&nbsp;&nbsp;&nbsp;作&nbsp;&nbsp;单&nbsp;&nbsp;位&nbsp; <label><br> <input type="checkbox" style="height: 12px;" id="checkbox1" name="qinshu_${y.qinshuid}" value="1"  
                            <c:if test="${1 == y.check2}">checked="checked"</c:if>        
                                  <c:if test="${ 1 != y.check2 && 4 != y.check2 && ( 0== y.zhiye || y.sftx==1)}">checked="checked"</c:if> ></input></label>
                                户&nbsp;籍&nbsp;派&nbsp;出&nbsp;所&nbsp;<label> <br> <input type="checkbox" id="checkbox1" style="height: 12px;" name="qinshu_${y.qinshuid}" value="2" 
                     <c:if test="${ 2 == y.check3 }"> 
                      checked="checked"
                     </c:if>
                      <c:if test="${  2 != y.check3 && 4 != y.check3 && ( y.jgp_yb != y.jzp_yb)}"> checked="checked"  </c:if>       ></input></label> 
                             现居住地派出所
                            </td>
                        </tr>
                        <tr>
                            <td>  
                             ${y.mobile}
                             </td>
                            <td style="text-align: left;"> 
                              ${y.jz_pro} &nbsp; ${y.jz_city}
                               &nbsp;${jz_county} &nbsp;${jz_dizhi}
                             </td>
                            <td style="text-align: left;">
                             ${y.jzp_pro} &nbsp; ${y.jzp_city}
                             &nbsp;${y.jzp_county} &nbsp;${y.jzp_yb}
                             </td>
                            <td> ${y.tongxindizhi } ${y.dw_yb}   </td>

                        </tr>
                    </s:iterator>
                </tbody>
            </table>

之前写的代码是这样的,

 $(document).ready(function(){ 
              $('#sample2 > tbody tr:even').css('background','white');
              $('#sample2 > tbody tr:odd').css('background','#f1f5f8');
             });

但因为有合并行,table里面两个tr,变色就成这样了。
图片说明

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

2条回答 默认 最新

  • qq_22782705
    qq_22782705 2015-02-11 05:11
    已采纳

    既然会循环为什么不会写个IF旁段呢 那循环的次数去/2能除尽的就是偶数 反之基数 基数的给这一行一个样式就行了

    点赞 评论
  • bdmh
    bdmh 2015-02-11 05:14

    你当时组织table时,肯定知道索引啊,奇数还是偶数都知道,设置不同色就行了

    点赞 评论

相关推荐