为了账号安全,请及时绑定邮箱和手机立即绑定

JQuery比较两个数,并进行背景色填充 (问题升级了!难度加大了)

JQuery比较两个数,并进行背景色填充 (问题升级了!难度加大了)

翻过高山走不出你 2018-12-06 17:36:27
例如:     这一行的第一个数字04,我想将围红中04下对用的这个单元格的背景色填充为红色     这一行的第二个数字10,我想将围红中10下对用的这个单元格的背景色填充为红色     ……     以此类推         当然了,整个红球这一大列的数字(6个数)是变化的,         我想用JQuery来实现,如果您有更好的想法,也可以     <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <title>测试</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <!-- <link rel="stylesheet" type="text/css" href="styles.css"> --> <script type="text/javascript" src="js/jquery-1.10.1.js"></script> <script type="text/javascript"> $(document).ready(function () { $("tr:gt(2)").each(function () { var tds = $("td.red_one", this); $("td.red_two", this).each(function () { var num = parseInt(this.innerHTML); if (tds[num - 1].innerHTML !== "") tds[num - 1].style.backgroundColor = "red"; }); }); }); </script> </head> <body> <br> <table align="center" border="0" cellspacing="0" cellpadding="0"> <tr> <td> <table border="1" cellspacing="0" cellpadding="0"> <tr> <td rowspan="2" height="18" width="72">期号</td> <td colspan="6" height="18">红球</td> <td rowspan="2" width="18" height="18">蓝球</td> </tr> <tr> <td width="18" height="18">一</td> <td width="18" height="18">二</td> <td width="18" height="18">三</td> <td width="18" height="18">四</td> <td width="18" height="18">五</td> <td width="18" height="18">六</td> </tr> <c:if test="${not empty bonusList }"> <c:forEach items="${bonusList }" var="a"> <tr> <td width="18" height="18"></td> <td width="18" height="18" class="red_one">04</td> <td width="18" height="18" class="red_one">10</td> <td width="18" height="18" class="red_one">14</td> <td width="18" height="18" class="red_one">19</td> <td width="18" height="18" class="red_one">23</td> <td width="18" height="18" class="red_one">26</td> <td width="18" height="18">06</td> </tr> </c:forEach> </c:if> </table> </td> <td> <table border="1" cellspacing="0" cellpadding="0"> <tr> <td colspan="33" height="18">围红</td> <td rowspan="2" width="18" height="18">验证</td> </tr> <tr> <td width="18" height="18">01</td> <td width="18" height="18">02</td> <td width="18" height="18">03</td> <td width="18" height="18">04</td> <td width="18" height="18">05</td> <td width="18" height="18">06</td> <td width="18" height="18">07</td> <td width="18" height="18">08</td> <td width="18" height="18">09</td> <td width="18" height="18">10</td> <td width="18" height="18">11</td> <td width="18" height="18">12</td> <td width="18" height="18">13</td> <td width="18" height="18">14</td> <td width="18" height="18">15</td> <td width="18" height="18">16</td> <td width="18" height="18">17</td> <td width="18" height="18">18</td> <td width="18" height="18">19</td> <td width="18" height="18">20</td> <td width="18" height="18">21</td> <td width="18" height="18">22</td> <td width="18" height="18">23</td> <td width="18" height="18">24</td> <td width="18" height="18">25</td> <td width="18" height="18">26</td> <td width="18" height="18">27</td> <td width="18" height="18">28</td> <td width="18" height="18">29</td> <td width="18" height="18">30</td> <td width="18" height="18">31</td> <td width="18" height="18">32</td> <td width="18" height="18">33</td> </tr> <c:if test="${not empty ddwhoneList }"> <c:forEach items="${ddwhoneList }" var="a"> <tr> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18" class="red_two">&nbsp;</td> <td width="18" height="18">&nbsp;</td> </tr> </c:forEach> </c:if> </table> </td> </tr> </table> <br> <!-- footer --> <jsp:include page="/global/footer.jsp"></jsp:include> </body> </html>   因为这个表需要从数据库的两个表中提取数据,所以在一个大表格中嵌套两个小表格,这样才可以使用<c:forEach items="${bonusList }" var="a">进行循环输出,如果您有更好的办法,请您告诉我!谢谢了!!!
查看完整描述

2 回答

?
富国沪深

TA贡献1790条经验 获得超9个赞

使用表单隐藏域。

<input type="hidden" name="key" value="04"  />

<input type="hidden" name="key" value="10"  />

<input type="hidden" name="key" value="14"  />

.....

下面的使用

<span><input type="hidden" name="value" value="14"  /></span>

然后一个$('input[@name=key]').each(){

$('input[@name=value][@value='  + this.value+ ']').parents().css("background-color","yellow");

}

就行了。

查看完整回答
反对 回复 2018-12-24
?
ibeautiful

TA贡献1993条经验 获得超5个赞

有没有个效果图?

查看完整回答
反对 回复 2018-12-24
  • 2 回答
  • 0 关注
  • 508 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号