例如: ??? 這一行的第一個數字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"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18" class="red_two"> </td>
<td width="18" height="18"> </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">進行循環輸出,如果您有更好的辦法,請您告訴我!謝謝了?。?!
JQuery比較兩個數,并進行背景色填充 (問題升級了!難度加大了)
翻過高山走不出你
2018-12-06 17:36:27
