Question

我有一个数据表，其中一列是“可用日期”。我只想显示可用日期在接下来的30天内的行。

以下是该表的简化示例：

<table id="properties">
  <tr>
    <td>Property 1</td>
    <td class="availability">4/11/2016</td>
  </tr>
  <tr>
    <td>Property 2</td>
    <td class="availability">9/29/2015</td>
  </tr>
</table>

我无法弄清楚如何将30天添加到日期，以便我可以将当前日期与每个表行中的日期进行比较，除了可能使用Date.parse（）等转换为毫秒。我是jQuery和JavaScript的新手，所以任何见解都会受到赞赏。

Answer 1

这是您在日期中添加30天的方式：

new Date()

请在此处查看AnthonyWJones的回答：https://stackoverflow.com/a/563442/617027

...这里的小提琴http://jsfiddle.net/sparebytes/XrWzq/为什么简单地使用{{1}}会导致月份和年份边界以及夏令时的问题。

Answer 2

您可以向日期对象添加30天，然后比较html中的日期

compareDate.setDate(compareDate.getDate() + 30);

var compareDate = new Date();
compareDate.setDate(compareDate.getDate() + 30);

var tdDate;
$('tr').each(function(){
  tdDate = (new Date($(this).find('td.availability').text()));
  tdDate = ((tdDate-compareDate)/1000/60/60/24/30);
  if(tdDate>0 && tdDate<30){
    $(this).show();
  }else $(this).hide();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="properties">
  <tr>
    <td>Property 1</td>
    <td class="availability">4/11/2016</td>
  </tr>
  <tr>
    <td>Property 2</td>
    <td class="availability">9/29/2015</td>
  </tr>
</table>

Answer 3

您可以使用.setDate()为日期添加间隔。以下示例将隐藏Property 3和Property 4行：

<强> HTML

<table id="properties">
  <tr>
    <td>Property 1</td>
    <td class="availability">9/22/2015</td>
  </tr>
  <tr>
    <td>Property 2</td>
    <td class="availability">9/23/2015</td>
  </tr>
  <tr>
    <td>Property 3</td>
    <td class="availability">12/28/2015</td>
  </tr>
  <tr>
    <td>Property 4</td>
    <td class="availability">10/2/2016</td>
  </tr>
</table>

<强> JS

var max_availability = 30;
var end_date = new Date();

end_date.setDate(end_date.getDate() + max_availability);

$("#properties td.availability").each(function() {
    var this_date = new Date($(this).text());

    if(this_date < end_date){
        $(this).parent().show();
    }
    else{
        $(this).parent().hide();
    }    
});

这是一个有效的JSFiddle

过滤表仅显示接下来30天内的日期

3 个答案: