我是一个javascript新手,想知道如何能够从每个日期获得日期td行,计算该日期和当前日期之间的天数,如果该数字大于假设100,则使这些行具有红色背景。下面的代码:从表格列中检索日期,并根据当天和日期之间的天数改变颜色行
<html>
<head>
<title>Due Bills</title>
<link rel="stylesheet" type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/css/jquery.dataTables.css">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script type="text/javascript" charset="utf8" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js"></script>
<script type="text/javascript" charset="utf8" src="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/jquery.dataTables.min.js"></script>
<script>
$(document).ready(function() {
$('#example').DataTable({
responsive: true
});
$('checkdate').on({
var today = new Date();
var currDate = today.getDate();
var date2 = new Date(2015,1,15);
var timeDiff = Math.abs(currDate.getTime() - date2.getTime());
var diffDays = Math.ceil(timeDiff/(1000 * 3600 * 24));
if(diffDays > 100){
$("#example tr").css('background-color', '#FF0000');
}
});
});
</script>
</head>
<body>
<table id="example" class="display" cellspacing="0" width="100%">
<thead>
<tr>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Age</th>
<th>Date</th>
<th>Salary</th>
</tr>
</thead>
<tfoot>
<tr>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Age</th>
<th>Date</th>
<th>Salary</th>
</tr>
</tfoot>
<tbody>
<tr>
<td>Tiger Nixon</td>
<td>System Architect</td>
<td>Edinburgh</td>
<td>61</td>
<td class="checkdate">2011/04/25</td>
<td>$320,800</td>
</tr>
<tr>
<td>Garrett Winters</td>
<td>Accountant</td>
<td>Tokyo</td>
<td>63</td>
<td class="checkdate">2011/07/25</td>
<td>$170,750</td>
</tr>
<tr>
<td>Ashton Cox</td>
<td>Junior Technical Author</td>
<td>San Francisco</td>
<td>66</td>
<td class="checkdate">2009/01/12</td>
<td>$86,000</td>
</tr>
<tr>
<td>Cedric Kelly</td>
<td>Senior Javascript Developer</td>
<td>Edinburgh</td>
<td>22</td>
<td class="checkdate">2012/03/29</td>
<td>$433,060</td>
</tr>
<tr>
<td>Airi Satou</td>
<td>Accountant</td>
<td>Tokyo</td>
<td>33</td>
<td class="checkdate">2008/11/28</td>
<td>$162,700</td>
</tr>
<tr>
<td>Brielle Williamson</td>
<td>Integration Specialist</td>
<td>New York</td>
<td>61</td>
<td class="checkdate">2012/12/02</td>
<td>$372,000</td>
</tr>
<tr>
<td>Herrod Chandler</td>
<td>Sales Assistant</td>
<td>San Francisco</td>
<td>59</td>
<td class="checkdate">2012/08/06</td>
<td>$137,500</td>
</tr>
<tr>
<td>Rhona Davidson</td>
<td>Integration Specialist</td>
<td>Tokyo</td>
<td>55</td>
<td class="checkdate">2010/10/14</td>
<td>$327,900</td>
</tr>
<tr>
<td>Colleen Hurst</td>
<td>Javascript Developer</td>
<td>San Francisco</td>
<td>39</td>
<td class="checkdate">2009/09/15</td>
<td>$205,500</td>
</tr>
<tr>
<td>Sonya Frost</td>
<td>Software Engineer</td>
<td>Edinburgh</td>
<td>23</td>
<td class="checkdate">2008/12/13</td>
<td>$103,600</td>
</tr>
<tr>
<td>Jena Gaines</td>
<td>Office Manager</td>
<td>London</td>
<td>30</td>
<td class="checkdate">2008/12/19</td>
<td>$90,560</td>
</tr>
<tr>
<td>Quinn Flynn</td>
<td>Support Lead</td>
<td>Edinburgh</td>
<td>22</td>
<td class="checkdate">2013/03/03</td>
<td>$342,000</td>
</tr>
<tr>
<td>Charde Marshall</td>
<td>Regional Director</td>
<td>San Francisco</td>
<td>36</td>
<td class="checkdate">2008/10/16</td>
<td>$470,600</td>
</tr>
<tr>
<td>Haley Kennedy</td>
<td>Senior Marketing Designer</td>
<td>London</td>
<td>43</td>
<td class="checkdate">2012/12/18</td>
<td>$313,500</td>
</tr>
</tbody>
</table>
</body>
你有没有尝试过什么呢?看看[在javascript中引用表格单元格]的w3schools链接(http://www.w3schools.com/jsref/coll_table_cells.asp) – Wold
该表格是否实际上是静态的,还是从数据库查询中生成?如果它是从查询中生成的,则可以将日期检查作为查询的一部分,并在输出数据时设置颜色。如果这真的是静态的,你有没有对HTML的控制权?如果是这样,则向包含日期的单元格添加类属性(例如,
感谢您的回答,这是一个静态表格,它将使用魔术软件从获取其数据,所以我可以按照您的说法进行操作。你是说我可以将一个类应用到日期单元格中并使用jqeury来计算日期差异并应用颜色? –
AdrianJG